Microthemer PRO 7.1.6.4

Boost your WordPress CSS editing capability​

The live CSS editor for learners and Pros

Microthemer PRO is a point-and-click CSS editor plugin for WordPress that helps site builders of any level design like a pro.
Easily create CSS grid layouts, design responsively, integrate with your favourite page builder (optional), use Sass, and get expert CSS help.

Live CSS editing with HTML inspection​

Your style edits appear on screen instantly, whether you use the visual styling options, the code editor, or a combination of the two. And to help ensure you always select the right element, Microthemer’s HTML inspector displays the underlying HTML code for the elements you select. This feature makes Microthemer the best live CSS editor for real world projects, and the perfect tool to take your understanding of HTML and CSS to the next level.

Customize anything you can see on the page​

Style any part of any WordPress page, from header to footer. This includes Gutenberg (or classic editor) post and page content, custom posts, hard-coded theme or plugin content, page builder content – you name it. Microthemer works seamlessly with your favourite WordPress tools to give you developer-level design control in a few clicks.

The biggest selection of CSS styling options​

Enjoy the largest set of CSS styling options provided by any WordPress CSS editor (150+). Choose from modern styles like animations, transitions, transforms, filters, flexbox, and CSS grid to web design essentials like typography, position, spacing, sizing, and backgrounds. The style fields will speed up your workflow significantly without sacrificing any control; you can switch back and forth between the style fields and the code editor as you please.

Drag and drop CSS grid controls​

CSS grid solves age old web design problems with columns that don’t vertically align, adapt to different screen sizes easily, or space apart without unwanted peripheral space. The only downside is the steep learning curve. But Microthemer’s visual drag and drop controls bring the power of CSS grid to the masses. You can create beautiful web layouts using CSS grid in seconds. It’s so much easier than the old way it almost feels like cheating.

Quick and easy access to Google fonts​

Save time and effort by visually browsing Google fonts without leaving the Microthemer interface. You can then insert the font you want with a single click. This dramatically simplifies experimenting with different Google fonts and ensures your site only loads the minimum fonts and variations needed for your design – no unnecessary font files.

Responsive design for mobile and tablet​

Microthemer takes the pain out of responsive design. Some common breakpoints are provided to help you get started, but are entirely customizable. Use the responsive tabs or drag the top ruler to check how your site looks on different screen sizes, and then fix any issues. This feature is super useful for creating pixel perfect layouts on mobile – no need to settle for cropped/bunched up text or strangely large spacing and heading typography.

Integrates with key page builders​

Microthemer integrates seamlessly with  Elementor, Beaver Builder and Oxygen. You add content with your page builder, then style it with Microthemer – at the same time, using a single browser tab.

For any other builder (e.g. Divi, Bricks, Breakdance, Brizy, Kadence, SeedProd), you simply edit the site frontend with Microthemer open in a separate browser tab.