Why dark themes deserve better contrast

Dark interfaces are often treated as a palette swap: take the light theme, invert the background, ship it. The result usually looks fine on the designer's display and turns to mush everywhere else.

Contrast is a system, not a switch. A dark theme needs its own hierarchy: a page background, a raised surface, a panel, and text that can still breathe at 14px.

Start with the surface

Pure black is rarely the answer. A slightly lifted charcoal leaves room for elevation and gives borders something to sit against. The difference between the page and the card should be small enough to feel like depth, not stripes.

Give muted text a job

Muted does not mean unreadable. Secondary copy still needs to pass contrast requirements; it just needs less contrast than the headline. If every label is 60% grey, the eye has no place to land.

Use muted tones for dates, captions, and metadata. Keep the things people need to scan — headings, links, buttons — at full strength.

Test in context

Check your palette over real content, at real sizes, in daylight. Then check it again with reduced brightness. A theme that only works in a dark room is a mood board, not an interface.

Good dark design is not the absence of light. It is a deliberate amount of it.