Back to gallery
Dark Mode UI — Cover

About Dark Mode UI

Dark Mode UI is the mainstream dark-theme interface language codified by Google's Material Design. Its baseline is a near-black charcoal of #121212 — deliberately not pure black — chosen to reduce eye strain and let elevation read. Depth is communicated not by drop shadows but by compositing semi-transparent white overlays over the ground: the higher an element rises, the lighter its surface becomes.

Accents are desaturated — a soft lavender, a muted teal, a dusty error rose — reserved for interactive emphasis. Body text rides on white at reduced opacity (87% / 60% / 38%), never full strength, so the interface stays calm, legible, and easy on OLED screens at night.

Learn more about the Dark Mode UI style

Origin
Global / internet (Android & cross-platform UI)
Era
2010s onward; Material Design dark-theme spec consolidated ~2018–2019
Key figures
Google Material Design team · Matías Duarte
Movements
Material Design · System-wide dark mode (OLED-era OS theming)

Dark Mode UI design spec

Colors

Background
Surface
Primary
Secondary
Accent
Text

Typography

RobotoHeadings
InterBody
Roboto MonoMono
Unlock for 1 credit

The other 11 sections — buttons, cards, spacing, motion, techniques and more — open once you unlock. Download the DESIGN.md or send it to your AI in one click. Unlock once, yours forever.

Sign up now
Have an account? Sign in

Styles similar to Dark Mode UI

Also inspired by brands & products, with a close feel.

Dark Mode UI1 credit · unlock forever
Sign up now
© 2026 Curio