YellowPencil: Visual CSS Style Editor
YellowPencil is a WordPress CSS-style editor plugin that allows you to customize your website design in real-time.
The plugin allows you to customize any page and theme without coding. Click on an element and start visual editing. Adjust colors, fonts, sizes, positions, and a lot more. Take full control over your website’s design with more than 60 style properties.
- Customize any page, any element
- Customize WordPress login page
- Automatic CSS selectors
- 60+ CSS properties
- Visual Drag & Drop
- Visual Margin & Padding editing
- Live CSS editor
- Live preview
- Manage the changes
- Undo / Redo history
- Export stylesheet file
The plugin provides you advanced tools and ready-to-use libraries for styling your website effortlessly.
- Flexible element inspector
- Single element inspector
- Responsive tool
- Element search tool
- Measuring tool
- Wireframe view
- Design information tool
- Gradient generator (pro version)
- Animation manager (pro version)
- Animation generator (pro version)
Reach many design assets with one click. Customize your website’s design to fit your needs!
- 800+ Google fonts (pro version)
- 300+ Background patterns (pro version)
- Unsplash background stock images (pro version)
- Material and flat color palettes (pro version)
- 50+ Animations (pro version)
CSS PROPERTIES: TEXT
- Font Family (pro version)
- Font Weight
- Color (pro version)
- Text Shadow
- Font Size
- Line Height
- Font Style
- Text Align
- Text Transform
- Letter Spacing
- Word Spacing
- Text Decoration
- Text Indent
- Word Wrap
CSS PROPERTIES: BACKGROUND
- Background Color (pro version)
- Background Image (pro version)
- Background Clip
- Background Blend Mode
- Background Position
- Background Size
- Background Repeat
- Background Attachment
OTHER CSS PROPERTIES
- Border Radius
- Width (pro version)
- Height (pro version)
- Box Shadow
- Pointer Events
COMPATIBLE WITH ANY THEME & PLUGIN
This works seamlessly with almost any WordPress theme and plugin. You can use it for editing the pages that you created with the page builders.
COMPATIBLE WITH ALL PAGE BUILDERS
The plugin allows you to customize the pages created with Gutenberg block editor, Elementor, or another page builder. Re-design your website today.
HOW DOES THIS WORK?
The plugin generates CSS codes like a professional web developer in the background while editing the web page visually.
The plugin doesn’t modify any theme file. Instead, it loads the generated CSS codes to the website dynamically to manage the changes anytime.
The following properties are available only in paid version;
- Font Families (Google fonts)
- Font Color
- Background Color
- Background Image
- Width & Height
Changelog YellowPencil: Visual CSS Style Editor 7.5.2
- UPDATEDGoogle fonts list updated.
- FIXEDFixed a bug that occurred when trying to open the item menu.
- FIXEDFixed a bug that occurred when selecting an item from the navigation tool while cursor mode was active.
Changelog YellowPencil: Visual CSS Style Editor 7.4.6
- Fixed a bug that occurred when selecting elements
- Fixed a bug that occurred when editing the CSS selector
- Performance improvements to the editor