← All terms
Labeled interface graphic showing what "Dark Mode" looks like

Fig. 50 / Dark Mode

Visual Design Vocabulary

Dark Mode

EXPLAINED SIMPLY:Dark mode is the version of an interface drawn in light text on dark backgrounds, designed as a complete second color scheme rather than the light version with its colors flipped.

Dark mode is the version of an interface drawn in light text on dark backgrounds, designed as a complete second color scheme rather than the light version with its colors flipped. Your phone, your editor, and most big apps now offer both, usually behind a toggle in settings.

The picture is the same run-tracking card twice, once per mode, and the button gives the game away. In light mode it's dark ink on a white card. In dark mode nobody just inverted it; the card became a soft near-black, the text became off-white rather than pure white, and someone redrew the button light so it still reads as the main action. Every element got a fresh decision for the dark room, which is what the annotation means by "not just the colors flipped."

Straight inversion sounds like a free feature until you try it. Pure white on pure black glares. Shadows stop working, since nothing casts a shadow in a dark room, so depth has to come from lighter surfaces instead. Brand colors that sat politely on white start buzzing on black and need retuning. The whole color palette needs a second, darker answer, and that's why dark mode is a design project, not a toggle.

People want it for practical reasons: dark screens are gentler at night and save battery on OLED phones, and plenty of us choose it purely on looks. The readability rules don't relax, though. Contrast has to pass in both modes, and faint gray on near-black fails exactly as hard as faint gray on white.

You'll also hear dark theme, and night mode from the era when it was pitched as a bedtime feature. The ordinary version is light mode, a name it only needed once the dark one existed. When someone asks whether dark mode is a quick win, the honest answer is that it's a second coat of paint on every screen you own. Budget accordingly.