Persistence of Pixels and Post-Apocalyptic Beavers

2025-06-02


Hey friends,

Why do gutters make bad storytellers?

They always leave you hanging.

(We had the gutters replaced on our house last week...)


Thinking Too Hard 🤔

While working on a site build last week, I was struck by the persistence of the pixel as a unit of measurement in web design.

Ever since we got high-resolution displays, a 'pixel' hasn't meant what it used to. It's no longer the smallest physical unit of a screen to display independent color, but another abstract unit. However, long ago, we were told that pixels were bad because they don't scale with a user's chosen base font size (true) — so we should always use rems, which USUALLY equals 16 pixels. Great.

Except all the web design tooling has remained in pixels. I cannot count the number of times I divide by 16 in a day.

My coworker, Max Fenton recently convinced me there was another way. Rather than constantly mathing, let the computer do the conversions with the pxtorem PostCSS plugin. So if Figma says 40px, put 40px, and the computer will output that as 2.5rems. It's a small thing, but being able to place values without pausing to convert them saves a lot of time on a UI build—all the accessibility with none of the math.

This only works, though, if you leave the base font size alone. Once you go full-root fluid you're 100% in relative land, but that's a topic for another day.

If you're interested in more of the details of units in sizing, Josh Comeau (as usual) has some more advice on the subject.


Interesting Web Bits

Other Stuff


Don't miss what's next. Subscribe to Net Noodlings with Nathan: