CSS Hero Visual CSS Editor

CSS Hero 3 is the definitive WordPress plugin to easily customize the appearance of your site, with a simple and user-friendly point and click user interface.

Plugin Features

Control Every Aspect
CSS Hero enables visual customization of any component of your site, all from your frontend. Live.
Customize Responsively
CSS Hero enables you to modify easily, preview and control how your site displays on desktop and handheld devices. Use standard breakpoints or your custom ones.
Device Mode Preview
Check tablet/mobile edits before driving them online, crafting a responsive theme has never been very easy.
Device Specific Edits
Personalize the way your theme displays on handheld devices, commit device-specific edits and preview them in a click.
Site Appearance Full Control
Simply mouseover and click the element you want to edit and adjust it to fit your needs, live!
Font Styles & Typography
Add a touch of class with your own fonts, a huge collection of Google Fonts is at your fingertips. TypeKit fonts are supported as well.
Color Management
Use a color picker to experiment live color and background changes like never before. Hero also stores your latest used colors, and helps building a consistent color palette.
Adjust Measures
Easily tune element margins and paddings: just drag a slider and view what happens.
UnSplash Integration
Ever wanted a nearly unlimited source of high quality, royalty-free, amazing pictures right at your fingertips? We’ve got you covered.
Complex CSS Made Simple
Spice up your site elements: building gradients, box-shadows, text-shadows and all the modern CSS properties is now a point and click affair.
Readymade Snippets
Pre-made editable style combinations ready to boost your creativity with one click!
Undo/Redo History
We all design by experimentation. Ouch! Need to undo? Don’t panic. CSS Hero automatically stores all your edits in a detailed history list, going back and forward in history steps is as easy as clicking the undo/redo buttons.
No Vendor Lock-in
Export your work as CSS, LESS, JSON data: you can export your site personalizations instantly and download it to file, for backup purpose as well.
CSS Code Editor
Review, refine and edit the generated CSS code while being able to quickly debug your work if needed.
Safe & Non-Destructive Editing
CSS Hero is alive WordPress Theme editor which works without the need to modify any of your theme files. It really is broadly suitable with many environments which are created to be light and tolerant.
No Performance Degradation
From a technical point of view, CSS Hero only generates and allows one additional static CSS stylesheet that overrides your Theme’s original stylesheet cleanly.
Unsplash Integration
Finding great images has never been this easy. Thanks to Unsplash, you can enjoy an [almost] unlimited source of amazing, royalty-free, high-quality images for use in your projects.
100% in Control with Inspector
Get extra control on your customizations with a complete fledged CSS/LESSCSS editor with live rendering. Add your extra guidelines, copy/paste and export your projects with one click easily.