Soon OdinCMS and OdinSTORE are on the way — be the first to know. Join the list
OdinZero
Get Pro Live preview
  1. Home page
  2. Help center
  3. Customizing

Dark mode

There is no built-in dark theme, but the CSS variables make one a single file of overrides.

ODIN ADMIN ships with a light content area and a dark sidebar. It doesn't include a ready-made dark theme or a theme switch.

Because colours are CSS variables, you can add one yourself: put the dark values in css/custom.css under an attribute and set it on <html>:

[data-theme="dark"] {
  --body-bg: #0F172A;
  --card-bg: #1E293B;
  --text: #E2E8F0;
  --border: rgba(255, 255, 255, .08);
}

Check css/base/variables.css for the exact variable names, and test charts and plugin themes (in css/vendor/), which use some fixed colours. A small script can toggle the attribute and remember the choice in localStorage.

Back to the help center