Theming

Corex is available in 3 differents themes Neo, Revo and Uno

Each theme is available in 2 different modes Light and Dark

Depending on the template used, imports and theming options will vary, see below the details for each Corex template

Corex

Despite the template not having the ability for the user to switch between themes and modes, the template is still available in each theme and mode

By default the themes Neo and the default mode Light are used

  
                      @import "@netoum/corex-css";
                      or
                      @import "@netoum/corex-css/neo.css";
                      or
                      @import "@netoum/corex-css/neo/light.css";
                      or
                      @import "@netoum/corex-css/neo/dark.css";
                      or
                      @import "@netoum/corex-css/revo.css";
                      or
                      @import "@netoum/corex-css/revo/light.css";
                      or
                      @import "@netoum/corex-css/revo/dark.css";
                      or
                      @import "@netoum/corex-css/uno.css";
                      or
                      @import "@netoum/corex-css/uno/light.css";
                      or
                      @import "@netoum/corex-css/uno/dark.css";

  
                @import "@netoum/corex-tailwind";
                or
                @import "@netoum/corex-tailwind/neo.css";           
                or
                @import "@netoum/corex-tailwind/neo/light.css";
                or
                @import "@netoum/corex-tailwind/neo/dark.css";
                or
                @import "@netoum/corex-tailwind/revo.css";         
                or
                @import "@netoum/corex-tailwind/revo/light.css";
                or
                @import "@netoum/corex-tailwind/revo/dark.css";
                or
                @import "@netoum/corex-tailwind/uno.css";        
                or
                @import "@netoum/corex-tailwind/uno/light.css";
                or
                @import "@netoum/corex-tailwind/uno/dark.css";

Modex

Modex template is available in all 3 themes and offers the possibility for the user to switch between light and dark mode

By default the themes Neo is used

  
                      @import "@netoum/modex-css";
                      or
                      @import "@netoum/modex-css/neo.css";
                      or
                      @import "@netoum/modex-css/revo.css";
                      or
                      @import "@netoum/modex-css/uno.css";

  
                @import "@netoum/modex-tailwind";
                or
                @import "@netoum/modex-tailwind/neo.css";
                or
                @import "@netoum/modex-tailwind/revo.css";
                or
                @import "@netoum/modex-tailwind/uno.css";

You must then add the mode data attribute

data-mode="light" data-mode="dark"

You can also use Corex Switcher to allow users to switch between modes, save their preferences in local storage and retreive it on page reload

Themex

Themex template offers the possibility for the user to switch all themes and modes

  
                      @import "@netoum/themex-css";

  
                @import "@netoum/themex-tailwind";

You must then add the theme and mode data attribute

data-theme="neo" data-mode="light" data-theme="neo" data-mode="dark" data-theme="revo" data-mode="light" data-theme="revo" data-mode="dark" data-theme="uno" data-mode="light" data-theme="uno" data-mode="dark"

You can also use Corex Switcher to allow users to switch between themes and modes, save their preferences in local storage and retreive it on page reload

Templates Starters