Dark Mode

Dark mode support in Aur UI.

Aur UI ships a dark token variant, so the component previews in these docs follow the documentation theme — switch the chrome to dark and the previewed components render on the dark console surface too.

The documentation site itself supports dark mode (toggle it from the navbar). Both the chrome and the component previews are built on @aur-ui/ui's dark token variant, so they switch together. If your application needs a dark variant of the components, add .dark overrides for the token groups described in Theming — for example:

css

.dark {
  --page-bg: #0b0f1a;
  --surface: #111827;
  --ink-900: #f8fafc;
  --ink-500: #94a3b8;
  /* …override the remaining ink / surface tokens to taste */
}

Because every primitive references the token variables rather than hard-coded colours, overriding the tokens is enough to theme the whole set.