1. SmartAdmin
  2. Theme Modes
  3. Layout Options

Theme Settings: Theme Modes (beta) Mix and match modes with skins to create an unique look

Why beta?

This is a brand new technique we are introducing which uses CSS variables to infiltrate color options. While this has been working nicely on modern browsers without much issues, some users may still face issues on Internet Explorer . Until these issues are resolved or Internet Explorer improves, this feature will remain in Beta.

If you are migrating from version 4+ to 4.5, there will be some DOM changes in the head section of the template, in order to get this new feature working.

Layout "Light Mode"
Change overlay CSS to light mode, enabling lots of whitespace color .mod-skin-light

Light Mode

Set mode by JavaScript setlayout.mode('light')

Layout "Dark Mode"
Dark Mode blocks blue light from the screen, making it easier on the eye .mod-skin-dark

Dark Mode

Set mode by JavaScript setlayout.mode('dark')

Layout "Default Mode"
Default color mode comes prepackged as a standard color pattern .mod-skin-default

Default Mode

Set mode by JavaScript setlayout.mode('default')

Layout "Glass Mode" (coming soon)
An optical illusion to shocase elements over a glass .mod-skin-glass

Glass Mode (coming soon)

Set mode by JavaScript setlayout.mode('glass')