CSS Functions Arrived and I Almost Missed It
There's this thing happening in CSS right now that feels bigger than people are treating it. Functions. Not the JavaScript kind. The actual CSS kind. @function is coming, which means we can write reusable logic directly in stylesheets instead of reaching for preprocessors or JavaScript tricks. I should be excited. I am excited, kind of, but I'm also wondering if this is the moment CSS becomes too much to hold in your head at once.
The alpha() function is already here, and it's solving a real problem—color manipulation without needing Sass or LESS. You can adjust transparency on colors dynamically now, which sounds simple until you realize how many times you've written the same color value five different ways just to get opacity variants. Figma does this. Stripe's design system probably does this. But most projects I've touched? Still using hex codes and guessing on lightness values.
- alpha() works in real browsers right now
- You can nest color functions. This is either elegant or a maintenance nightmare, I haven't decided
- Preprocessing becomes optional instead of required
- Your team still needs to agree on a color naming convention, or you'll drown in variable names
Grid Lanes and the Dialog Problem We Keep Ignoring
CSS Grid got a refresh with lane-based naming, which means you can stop counting grid columns like you're defusing a bomb. Sounds good. But here's the thing—I've built custom grid systems in actual production that would've benefited from this five years ago, and now I'm not sure if adopting it is worth the refactor. The mental model shift is real. Your designers aren't thinking in lanes. Your junior developers will need training. And the old syntax still works, which means legacy code and new code will coexist in the same file forever.
Then there's Dialog, the HTML element that's been sitting around for longer than most people realize. I'm not sure this is the right move, but we've been building modals with divs and JavaScript event listeners for so long that Dialog feels like cheating when you finally use it. The accessibility is built in. The backdrop is native. You don't need a third-party library. Yet somehow developers still reach for custom solutions because it's what they know.
CSS Wordle and Why I Don't Play Games at Work
Someone made a Wordle clone entirely in CSS. Pure CSS. No JavaScript game logic. This is the kind of thing that makes you rethink what CSS can do, and I respect the technical flex, but I spent two hours down this rabbit hole when I should've been shipping a feature. That's the real cost of novelty. Browser performance matters more than novelty. User experience matters more than technical showmanship. I'm not sure I believe that completely, but I'm trying to.
- It's technically impressive
- It's practically pointless for most projects
- It lives on GitHub and will have four stars
- It'll somehow end up in a technical interview question in six months
What We're Actually Doing Wrong
The pattern I'm seeing across all of this—functions, Grid lanes, Dialog, the whole stack—is that CSS keeps getting more capable while developer adoption stays fragmented. According to the State of CSS 2023 (that report nobody finishes reading), Grid adoption hovers around 70% for awareness but actual daily use is probably half that. We learn features. We don't ship with them. We build fallbacks for older browsers that probably don't matter anymore.
I'm building a product right now where we could use @function to reduce CSS file size by 40%, maybe more. But the team hasn't shipped a CSS update in two years. The argument—and I'm not sure this is wrong—is that CSS works fine, browsers are handling it, and breaking it to add theoretical improvements isn't worth the risk.
That's the real conversation we should be having. Not whether CSS functions are cool. Whether they're worth the migration debt.
