dexterdev8

writing / / 4 min / meta · css

A fresh coat of neon

The terminal window that used to be this site has been retired. What replaced it is a small publication — this is the note that explains the paint.


For a couple of years this site was a terminal: a floating window with macOS traffic-light dots, $ cat about.md prompts, and a blinking cursor. I liked it. It said "developer" before you read a single word. But it was a costume — every pixel was chrome, and the actual content lived in a 720px box that could hold exactly one screen of me.

Then I decided I wanted to write here. And a terminal window is a terrible place to read two thousand words about Rust.

The window is gone #

So the window is gone. No dots, no borders, no glassy cards. The page itself is the surface now — near-black, matte, mostly empty — and the hierarchy is carried by type: an editorial serif for anything display-sized, a mono for kickers and metadata (the one survivor from the old site), and a quiet sans for everything you actually read.

The neon stayed, because the neon was never the problem. But it changed jobs. The old design glowed at the container and left the text plain; this one flips that logic — matte page, luminous type. Headlines are printed in gradient "neon ink", section dividers are hairline light-filaments, and hovering an index row heats its hairline up like a filament being switched on.

One rule runs the whole thing #

Glow attaches to things you glance at — headlines, rules, hovers. Never to things you read for minutes.

That's the entire design system, honestly. Body copy is flat paper-on-ink at comfortable contrast, code blocks are deliberately the most boring surface on the site, and metadata never shines. If neon is everywhere, it's noise; if it only marks the things your eye is meant to land on, it's signal.

The gradient headlines hide one genuinely annoying CSS gotcha, so let me write it down for the next person: text-shadow silently dies on background-clipped text. If you want clipped gradient type to bloom, the glow has to be a filter.

/* text-shadow does nothing on clipped text —
   the bloom must be a filter */
.ink {
  background: linear-gradient(100deg, #ff77bc, #b79cff 48%, #7de9ff);
  background-clip: text;
  color: transparent;
  filter: drop-shadow(0 0 16px rgba(255, 119, 188, 0.3));
}

The other detail I'm fond of is the interaction timing. Everything that lights up flares in fast and decays out slow, like cooling phosphor:

.row { transition: box-shadow 0.7s ease; }  /* cool down slowly  */
.row:hover { transition-duration: 0.18s; } /* flare up fast     */

Two declarations, and every hover on the site stops feeling like a boolean.

Still one folder of files #

The architecture didn't change, on purpose. This is still plain HTML files and one shared stylesheet, served as-is. No framework, no build step, no JavaScript — the reading-progress bar at the top of this post is a CSS scroll-driven animation, and if your browser doesn't support it you simply don't get one. Adding a post means writing an HTML file and adding one row to the index. I can live with that contract for a long time.

Even the old blinking cursor survived, demoted from centrepiece to a single winking ▌ in the homepage kicker. A site should be allowed to remember what it used to be.

What I'll write here #

Field notes, mostly: DeFi internals, Rust, Solana plumbing, and the occasional lesson learned shipping systems that hold other people's money. No cadence promises — I'll write when there's something worth saying. If you'd rather not check back manually, there's an RSS feed.