Using Microthemer with Oxygen

Published: April 20, 2020By Sebastian
This image is showing a section of a webpage with containers for a music instructor's cases, headings, text, links, and a background text link. Full Text: Containers - MUSIC INSTRUCTOR CASES Section Div - - - - - SUBHEADING Columns LIKE Heading Text T Lorem ipsum dolor sit amet, quo ullum el gene Heading Text deseruisse ea, et corpora unnelletur theophrastus mea. LEARN MORE LET'S ROC Rich Text Links Background Text Link Link Wrapper na Holloway Dale Crois

Microthemer’s integration with Oxygen has been finalised now. This means you can use Oxygen and Microthemer at the same time, from a single browser tab. Or, via two connected tabs when using two screens.

This is exciting news. Microthemer and Oxygen are well suited because both tools cater for developers as much as beginners. And with the latest integration, our mutual community of users can combine both applications seamlessly.

Note: you can jump to specific sections of the video below.

00:00 Microthemer overview
00:34 Using Microthemer and Oxygen at the same time
01:45 CSS grid example
01:22 Create rows and columns with drag and drop
01:36 Position items within the grid using drag and drop
02:00 Adapting grids for mobile
02:28 Overriding Oxygen flexbox layouts
03:30 9 Reasons to use Microthemer with Oxygen
03:36 Full CSS variable support
05:25 Responsive CSS variable technique
06:16 Customisable media query breakpoints
06:37 Granular control over page element styling
07:06 Advanced HTML and CSS inspection
07:35 Style sets of related elements in one go
09:15 Code editor and UI fields can be used interchangeably
10:07 Lightning fast Sass support
10:30 Clean CSS code is written to a single CSS file, which can be loaded manually after uninstalling Microthemer
11:17 Additional integration features
11:10 Load Microthemer's stylesheet after Oxygen
11:29 Media query views synced with Oxygen
12:05 Site navigation menu for loading Oxygen pages and templates
12:38 Oxygen HTML cleaned when active for easier inspection
13:01 Improved selector algorithm, thanks to awesome user testing by Dean Phillips
13:30 Oxygen Enhancer and Agency Tools integration
14:13 Online Oxygen demo

Try the online demo

Launch demo

Get Microthemer

View price plans

  • Keep in touch…

    Don't miss out on tutorials, special offers, and discounts we share with our subscribers!

  • Follow us on:

    Facebook Twitter

  • Refer friends for benefits

    We know that lots of you have been happily recommending Microthemer to your friends. This really helps us out. And to say thanks, we'd like to start giving you some commission for sending customers our way. Find out more.

Close