When dark mode became an expected feature rather than a novelty, a lot of teams reached for the fastest possible implementation: take the light theme, flip the colors, ship it. The results were technically dark and almost universally worse than the light versions they came from. Text glowed uncomfortably, shadows disappeared, brand colors turned radioactive, and photos looked like they were floating in space. The lesson that industry learned slowly is that a dark theme is a separate design problem, not a mathematical operation performed on a light one.
Inversion Is Where Most Dark Modes Go Wrong
The instinct to invert comes from a reasonable place. If black text on white becomes white text on black, the contrast ratio is preserved, so surely the theme is legible. But contrast is only one variable, and preserving it does not preserve comfort. Pure white text on pure black produces a harsh, vibrating edge that tires the eyes, especially at small sizes and in dark rooms where the pupil is dilated. The high-energy white against the void creates a halation effect where the letters seem to bleed light into the surrounding darkness. What looked crisp on white becomes fatiguing in reverse.
Good dark themes almost never use the extremes. They pull the background up off pure black and pull the text down off pure white, landing on an off-white around the tone of aged paper against a deep charcoal or near-black grey. The contrast is still strong, but the edges are calmer. That single adjustment, softening both ends, does more for a dark theme’s quality than any other decision.
Pure Black Is Rarely the Right Background
There is a persistent myth that dark mode should use true black, partly because true black saves power on OLED screens where black pixels are simply switched off. Battery savings are real, but design quality usually argues the other way. A pure black canvas gives you nowhere to go when you need to show depth. Every surface that sits above the background needs to be lighter than the background, and if the background is already at zero, your lightest and darkest surfaces are cramped into a narrow band that is hard to distinguish.
Starting the background at a dark grey rather than absolute black gives the whole system room to breathe. Cards, sheets, menus, and elevated elements each get their own subtly lighter shade, and the difference between them stays perceptible. If OLED battery savings genuinely matter for your product, a true-black variant can be offered as a separate high-contrast or power-saving option, but it should not be the default that the rest of the design has to fight against.
Elevation Has to Be Rebuilt From Scratch
In a light interface, depth is communicated mostly through shadow. An element that floats above the page casts a soft shadow, and the eye reads it as closer. In the dark, shadows barely register, because a dark shadow on a dark surface is nearly invisible. Teams that simply carry their light-mode shadow values into dark mode end up with a flat, muddy interface where nothing feels layered.
Dark themes have to invert the logic of elevation. Instead of higher elements casting darker shadows, higher elements become lighter surfaces. The closer something is to the user, the more light it appears to catch. A modal sitting above a menu sitting above the page is expressed as three increasingly light shades of grey rather than three increasingly heavy shadows. Shadows can still play a supporting role, but light does the primary work. Rebuilding your elevation system around brightness rather than shadow is one of the most technically necessary and most frequently skipped steps in dark-mode design.
Color Saturation Behaves Differently in the Dark
A brand blue that looks confident and grounded on a white page can look neon and cheap on a dark one. Saturated colors carry far more visual energy against a dark background because there is no bright field competing with them. The same hex value that read as calm now reads as loud. This is why lifting a light theme’s accent colors directly into dark mode so often produces something that feels garish and slightly hostile.
The fix is to desaturate and often lighten the accent and semantic colors for the dark theme. Reds, greens, and blues that signal errors, success, and links all need their own dark-mode values, tuned so they sit comfortably against charcoal rather than screaming off it. Images and illustrations deserve attention too. Full-brightness photography can feel like a spotlight in an otherwise dim room, so many products apply a subtle dimming layer to media in dark mode so it integrates with the surrounding calm instead of puncturing it.
Two Themes Means Twice the Testing
Once you commit to a real dark theme rather than an inverted one, you have effectively doubled your surface area. Every screen, every state, every edge case now exists in two visual worlds, and they will not stay in sync on their own. A disabled button that reads clearly in light mode can become invisible in dark mode. A red validation message that pops on white can disappear against charcoal. Focus rings, dividers, placeholder text, and overlay scrims are the usual casualties, because they rely on subtle contrast that survives in one theme and collapses in the other.
The teams that keep both themes healthy tend to build their color decisions as semantic tokens rather than raw values. Instead of a button being defined as a specific blue, it references a role such as primary-action-background, and each theme supplies its own value for that role. This keeps the two themes structurally identical while letting them look correct independently, and it makes it far harder for one theme to silently drift while everyone stares at the other.
Deciding Whether You Need Dark Mode at All
The final and least fashionable question is whether the effort is warranted. Dark mode is genuinely valuable for products used at night, in media-heavy contexts, and by users who simply prefer it, and offering it signals care. But a half-built dark theme that no one owns is worse than none, because it becomes a permanent source of broken states and support tickets. If a team cannot commit to maintaining two themes with equal rigor, it is more honest to ship one excellent theme than two mediocre ones. Dark mode earns its place when it is designed as its own artifact, tested as its own artifact, and maintained as its own artifact, not when it is treated as the light theme wearing a costume.