A candidate for Interop 2027: Scroll-Triggered Animations, the missing key to scrollytelling in CSS. I wanted to create demos showing how to wire them up and easily create fun effects (especially with typography). To be complete, I also added syntax info, tips, and tricks. Happy scrolly!
🚀 5 years of blogging and spreading a bit of joy for development. The landscape might be changing, but I will keep writing about it. A short reminder of where the name came from, what I've learned, and just my thanks to all those who supported me
🎂 🥳 🍾
https://utilitybend.com/blog/5-years-of-blogging-on-utilitybend
🚀 Container style queries are baseline; New attr() capabilities are nearly there. Neat apart, but together they change how we can wire up components. Practice will make perfect, and I still need to rewire my brain for this combo. So, time to start that rewire.
I was going to do a short post on Modern Web Guidance; it turned into a huge deep dive. Here's what it does, why it raised eyebrows, and on-point information with truth bombs. I tried to be complete and honest. It's not magic, but in time, it might just make the web a little bit better.
https://utilitybend.com/blog/modern-web-guidance-antigravity-and-my-own-design-token-skills
⏸️ I still have problems writing personal blog posts, but here it goes: This is why I need a holiday, and I'm taking a (huge) one! 🏝️ See ya'll in August
https://utilitybend.com/blog/ai-brains-css-overload-writing-i-need-a-break-and-im-taking-one
🚀 Time for something else: a collection. I wrote about 3 web features that reached Baseline support but slipped under my radar: the CSS Custom Highlight API, advanced text indent, and native Math.
Not the most flashy ones, but I just wanted to play with them.
📐👌
https://utilitybend.com/blog/under-my-radar-highlight-text-indent-and-font-family-math
🚀 🧑💻 My CSS Day recap on the iO tech_hub. Thank you to iO for letting me stay in Amsterdam with my training budget. Fourteen talks, two days, one church, Lea on gamut, Jake on the <select>, Lyra’s x86 CPU, Niels’s DOOM CSS, Una on modern UI, and many more. This was CSS Day 2026
https://techhub.iodigital.com/articles/this-was-css-day-2026-a-dive-in-css-geekism
🚀 I don't write many articles that don't have a technical angle or demo... but I had to get this off my chest.
🚀 New article about a landscape change. I feel like I had to try this, so I also shared some thoughts on it: I experimented with bringing my blog’s visual identity into ChatGPT via MCP + a custom widget.
Just tinkering...
I wondered: Is there value in this? Is this the future? probably not, but I've created UI in so many environments, why not try this one as well... In the end, I'm a UI developer, creating beauty on the web is the job
🚀 New article on gap decorations (coming soon) in CSS. I have a small obsession with clean layout lines, and this is the first time it feels easy to draw them without polluting the markup. Goes through the new properties, a playground, and some experiments... 👾
https://utilitybend.com/blog/css-is-filling-the-gaps-with-rules-a-way-to-style-gaps-in-grid-and-flex
Also a shout-out to @Schepp for inviting me there. ♥️ It was really top notch. And lastly I'd like to say, of you live in the area. Do go to @engkiosk meetups. These events are important. Go in even if it's about a programming language that you don't write, it might inspire you, make you grow and you make a new friend or two.
What a week! A fantastic @btconf conference. Great speakers, atmosphere, got to meet so many nice people as well. I hearty recommend this conference! It is the perfect size and the vibe is really something else (In a good way) wasn't able to talk a lot to @marcthiele about it, but I'm sure he got the message from the audience, we loved it. Yesterday I got to top it off with a little presentation at @engkiosk and ended with a nice performance talk by @moonglum and @alaaReuschenbach
On April 29, @alaaReuschenbach and I will give a talk about Web Performance at @engkiosk Rhine-Ruhr 😀 @utilitybend will talk about how CSS became a state machine. See you there?
https://engineeringkiosk.dev/meetup/rhine-ruhr/
The Community Has Spoken, Now We Need Browsers Vendors to Help: A “<rangegroup>” Update, by @utilitybend:
https://utilitybend.com/blog/rangegroup-needs-you-community-feedback-and-a-call-for-browser-support/
🚀 Mini article. I turned the styling of my code snippets on the blog to a proper theme that you can use 😇 I already had a version of them in my editor, so I thought... why not share them?
https://utilitybend.com/blog/bringing-the-utilitybend-colors-to-your-vs-code-editor-neon-and-creme
... and we can announce our final three speakers:
@Meyerweb the father of CSS testing and documenting
@jaffathecake (Mozilla), returning to conferences near you
@csswizardry who's going to talk about his recent article about containment
See you there!
An update on <rangegroup>: I shared anonymised feedback from the form, what changed in the explainer (e.g., disabled state), and why I still need you to make noise. Community feedback is priority number 1 at this point; without it, I won't be able to move forward.
https://utilitybend.com/blog/rangegroup-needs-you-community-feedback-and-a-call-for-browser-support
So here's a fun one. You know the "hidey-bar" pattern: header hides when you scroll down, reappears when you scroll up? CSS can do that now with scroll-state(scrolled). And scroll-padding makes sure anchor links don't get buried behind the header.
Except... clicking an anchor doesn't trigger scroll-state. The header doesn't know you just navigated. scroll-padding reserves space for a header that isn't there. Everything goes out of sync.
I filed a CSSWG issue about it: https://github.com/w3c/csswg-drafts/issues/13787
🚀 A little while ago, I released an article on my blog redesign as a progressive enhancement. A few people DM'd me after that, asking for more info on the architecture. Well, it sure isn't perfect, and I'll surely tinker more on it, but I wrote about how I did the new CSS Architecture 🤓
https://utilitybend.com/blog/under-the-hood-a-closer-look-at-the-css-architecture-behind-the-redesign