ORCA-TECH
Back to articles

Design

Dark UI contrast that still passes

Nina Alvarez · 2025-03-19 · 6 min

Circuit in blue light
Dark laptop scene
Night workspace

Atmosphere is allowed. Invisible body copy is not. Dark marketing sites love muted grey on darker grey because it looks expensive in a screenshot. It fails in a brightly lit office and it fails WCAG.

We test muted-on-surface pairs and raise the floor before we ship glass. Glow is decoration. Contrast is the product.

Glow is not contrast

A blue bloom behind a button does not help a low-vision reader. We keep focus rings boring and bright, and we never remove outlines because they 'clashed with the brand'.

Glass panels get a real fill opacity, not a rumour of a panel. If text sits on a photo, we add a scrim until the contrast checker is quiet.

Check in the real lighting

We look at the site on a phone outdoors and on a washed-out laptop. Studio monitors lie. Customers do not live in our studio.

Ship contrast that passes, then add atmosphere on top. The other order is how you rebuild a homepage after launch.

Related articles

Figma-to-code contracts that survive a sprint

Design

Figma-to-code contracts that survive a sprint

Auto-layout, named layers, and the inspection ritual we run before estimate.

Omar Farouk · 2025-02-07 · 6 min

Read article
Motion that does not lie about state

Design

Motion that does not lie about state

Duration, easing, and the reduced-motion path we ship on every marketing surface.

Nina Alvarez · 2025-04-08 · 6 min

Read article
Ship tokens before you ship a button

Design

Ship tokens before you ship a button

Color, type, and space as code — so dark mode is not a weekend project.

Nina Alvarez · 2025-05-16 · 6 min

Read article