Designing in the dark
· 1 min read · design, css
Dark interfaces are easy to make and hard to make well. Pure black with pure white text vibrates; too many accent colors and it turns into a casino.
One accent, used sparingly
This site uses a single signal color — a hot vermillion borrowed from torii gates and hanko stamps — and lets everything else stay in grayscale. When red appears, it means something: a link, a status, the thing you should look at.
:root {
--ink: #050505;
--paper: #f2f0ea;
--signal: #ff2a3d;
}
Texture over color
Instead of more hues, depth comes from texture:
- a faint grid that suggests a city at night,
- scanlines at a few percent opacity,
- type set in two scripts, Latin and katakana, side by side.
Motion with intent
Glitches are fun once. Here they only fire on hover or on first paint, and they switch off
entirely under prefers-reduced-motion.
The goal is a page that feels like a neon sign in the rain: mostly darkness, with one bright thing worth walking toward.