More than just CSS

A complete website
customization toolkit

Discover how much CSS Hero can do to make your website stand out from the crowd

Unsplash Integration

Add great background images to your site

Thanks to Unsplash you can enjoy an [almost] unlimited source of amazing, royalty-free, high quality images to use in your projects.

Search by keyword, choose an image and a size, and instantly apply as a background-image of any site element.

Finding great images has never been so easy.

New in V5

Live Mobile Preview

While editing your website with CSS Hero, you can preview in real time the effects of your customization on your mobile phone, right into your hands.

There’s nothing like viewing the real thing on your physical device.


Scan the QR Code on the bottom bar of the CSS Hero editor interface with your mobile device.


Any new edit will be now visible also on your mobile in real time.

My website

Now that it's all over and done, now that you find, now that you're whole

Now that you're whole

My website

Now that it's all over and done, now that you find, now that you're whole

Now that you're whole


Use any Font

Easily embed any kind of font, built-in support for Google Fonts, Typekit and now upload your custom fonts is available too (.otf,.ttf and .woff supported).

New in V5

Video Backgrounds

Video speaks louder than words and now you can bring your web pages to life with video backgrounds. A wide selection of free footage from Coverr is available at your fingertips.

Spice up your website

On-scroll Animations

Easily apply on-scroll animations to any element on your pages, choosing among a wide set of effects such as fade, flip, slide, zoom - and fine tune their parameters.

Animations are implemented in CSS Hero using the AOS animation library, which is solid, lightweight and versatile.

New in V5

HTML \ CSS Inspector

A built-in inspection tool, to accurately analize and target the right elements that you want to edit.

Live Javascript Editor

Adding your own JavaScript code and integrating popular libraries in your sites is now possible directly from the front page of your website with live linting and rendering.

New in V5

Sitewide Preview

Watch how your CSS site edits propagate to every corner of your site and gather a global visual overview of your project

CSS classes

Use CSS readymade snippets, or store and recall your own

CSS Hero comes with a library of CSS snippets that you can immediately apply to your page elements.

For example, you can instantly turn a plain link into a cool looking button.

Moreover, you create your own custom CSS snippets and assign them to multiple elements of your site, while keeping a central point of control - instead of relying on a messy "copy-paste" approach.

Color Palette generator

Awesome color combinations

Once you set up your brand color, CSS Hero will help you find colors that greatly match.
Stop wasting your time looking for the right colors for your site.

Customize any element of your website

Reach any element on your website easily with CSS Hero.

Style as unlogged

Style your website while having a real glance of how it will look like for your unlogged users.

Style login page

Styling WordPress log-in page has always been painful, forget about it, you can now style it in a breeze.


Error proof workflow

CSS Hero keeps track of all your edits in a detailed history list.

If you make a mistake, no worries: going back and forward is as easy as clicking the undo\redo buttons.

Instant Recovery

Easily restore your last working edits in case of plugin crash or any accidental loss of data.

Save Checkpoints

Store snapshots of your edits without having to push them live, store different versions, choose the one you prefer and go live.

  • 2021/03/19 - 9.57 AM
  • 2021/03/19 - 9.51 AM
  • 2021/03/19 - 9.44 AM
  • 2021/03/19 - 9.37 AM
  • 2021/03/ 19 - 9.36 AM
  • 2021/03/19 - 9.19 AM
  • 2021/03/19 - 8.50 AM
  • 2021/03/19 - 8.44 AM
  • 2021/03/19 - 8.41 AM