Dark Mode (OLED)
Also called: OLED dark, Pure black UI, AMOLED theme
True #000 black canvas, hairline-defined surfaces, crisp off-white text and one desaturated accent — pixels off, content on.
Design keywords
Say these words to ask for this style.
Built for OLED screens where black pixels are switched off: the page is pure #000000 and surfaces barely lift (#0A0A0A–#141414) or stay black and are drawn with 1px #232323 hairlines instead of fills. Text is high-contrast off-white with a clear grey hierarchy; colour is reserved for one desaturated pastel accent (a soft mint) used on the primary action, the active state and chart line. Glow is minimal — a faint halo on focus and live indicators only — so the screen reads as calm, inky and battery-friendly.
Best for
- Video, music and podcast apps
- Night-time reading and long sessions
- Phone-first products on OLED devices
- Photography and media galleries
Avoid for
- Daytime productivity tools used in bright offices
- Long light-reading articles for older audiences
- Brands whose identity is a bright colour
✓ Do
- Use #000000 for the page and full-bleed sections
- Lift surfaces with 1px #232323 hairlines (#333 for input and button hairlines) or ≤ #141414 fills, not shadows
- Desaturate accents to pastel (e.g. #8FD1C8) so they do not vibrate on black
- Use off-white #EDEDED for body text and #FFFFFF only for headings
✕ Don't
- No dark-grey #121212 page backgrounds — that is Material dark, not OLED
- No saturated neon or big glows (that turns cyberpunk)
- No drop shadows — they are invisible on black
- Don’t use thin 300-weight body text; it blooms and smears
Not to be confused with
On mobile
This is where OLED shines: a #000 screen with a hairline-topped tab bar saves real battery. Keep 16px+ body text in #EDEDED, use the mint accent only for the active tab and primary button, and skip blur entirely.
Prompt builder
Paste into Claude, Cursor, v0, Lovable or any coding agent to recreate this style.