04·Design Systems·03 / 12

How Dark Mode Works

1
Elevation doesn't need shadows
Surfaces lighten as they rise — 1dp to 24dp mapped to precise white-overlay opacity steps instead of box-shadow.
2
Saturate less, read more
Full chroma vibrates against dark backgrounds. Every accent color ships at reduced intensity to keep long-form text comfortable.
3
Opacity is the new weight
Body text at 87%, secondary at 60%, disabled at 38%. No full-white anywhere on the page — contrast stays readable without glare.
4
Dark is darker than black
Charcoal surfaces reduce eye strain versus pure black and eliminate OLED scroll smear. A two-percent lift makes all the difference.
Strata 03 / 12
This is the Dark Mode UI design system, applied by Curio Design — a design-style library for AI agents. Full Dark Mode UI guide → designbycurio.com/learn/dark-mode-ui-oled-2018