Brecht De Ruyte

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. utilitybend.com/blog/rangegr...

I wish I was at TPAC #thereisaidit

It's kinda funny sometimes. I've been talking at quite a lot of amazing conferences. At the same time, I still don't feel like "a speaker". I get good feedback, I put in the work. Anyway. It's weird. When do you become a "hot shot". Do I even want to? Idunno. Just love to talk about the web, I guess

🚀I wrote a random() thing 🤭 do check it out. When I first heard about random(), I had no idea what to think of it. So, this blogpost is actually me trying to make sense of it and hopefully, me documenting this can help you make sense of it as well 😊 www.smashingmagazine.com/2026/10/embr...

Quite a heavy day at the office. 😅 But nothing that a good evening walk can't fix. Wasn't able to do a lot of sightseeing but first thought of Stavanger. Pretty!

🟠 Scroll-triggered animations: Variable Font: expand, shrink, squoosh by Brecht De Ruyte @utilitybend.com on @codepen.io #css #webdev codepen.io/editor/utili...

More range sliders with fancy shapes? Let's go! This time with a tooltip showing the value. curve, wave, zig-zag, arc ... Which one do you prefer? css-tip.com/shaped-range... 0% JavaScript and 100% CSS magic (border-shape, shape(), scroll-driven animations, and more!)

#inktober 18: flightless.

There were already two ways to make a color transparent in CSS, color-mix() and relative colors, and both work great. So why did they add a third with the alpha() function, which recently hit Baseline Newly Available? youtu.be/Pfj9OmvqU0Q

#inktober 15: hooray! It's Friday. (Skipping 16)

More stuff to play with!

Earlier this week, I launched this article and for some reason I'm having typography vibes. So many fun things we can do with letters!

#inktober 14: Lady

Created a PR for Modern web guidance. Since I try to show it to my AI-loving vibe coder friends to at least nudge them to use a bit of web standards. But it always failed on popovers to get them fully modern. So... I'm trying to patch it: github.com/GoogleChrome...

An Open Letter to the People Writing Lengthy Posts About “Why I’m Going Back to Twitter”, by @dansinker@omfg.town: https://dansinker.com/posts/2026-10-12-open-letter/?ref=frontenddogma.com #openletters #twitterx #socialmedia

#inktober 13: flimsy

Being a big fan of the CSS Typed OM, I’ve wanted a proper polyfill for it for years. Just before my summer vacation back in July, with the help of Gemini/Antigravity, I finally built one: css-typed-om. → brm.us/css-typed-om...

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!

I have to say... I don't like my picture taken, but the photographer at #frontmania was able to capture my enthusiasm when showing CSS quite nicely. I sometimes feel like a little kid when making and presenting demo's : It moves! It pops! It brings joy! 🤭

Following my Scroll-Driven Animations Debugger Extension for Chrome DevTools, I’m working on a similar extension to help you debug Scroll-Triggered Animations. Sneak peek: youtu.be/C5hn16x31I8 WDYT? Any features you want to see?

Wrote a thing on why we should have interactive lists on the web: sarahmhigley.com/writing/inte... If anyone has their own interactive list use cases that aren't covered, send them to me! I'm putting together an ARIA spec PR this month.

#inktober 12: toss. We do a lot of tossing nowadays. You know, LLMs and such.

#inktober 11: rescue Circles are hard

Had a bit more time for #inktober 10: mystical. Took out the big book.

What do you want us to work on in 2027? Here's a web app where you can rank the Interop proposals you care about, giving us data we can use to prioritise feature development. interop-rank.fxdx.dev

#inktober 9: Ram. Probably not what they had in mind, but once a nerd.... Happy weekend!

#inktober 8: stinky 😂

Variable font animations are fun.

Remember Internet Explorer’s “Page Transitions”? Well, they’re back, thanks to the View Transition API! → Blog post: brm.us/page-transit... → Demo site: page-transitions.style The project leverages IE’s meta tags so browser support is not limited to Modern Browsers™ but also includes IE 5.5–8.0 😆

@rowdy.codes starting a presentation about core web vitals at #frontmania

Going to frontmania. Got 45 minutes to do my talk, currently runs at 50mins so time to kill some darlings. Also #inktober 7: panic!

Yeah... Nope. #inktober 6 fail: ogre

I barely have time today and inktober is an Ogre.... I can't draw an Ogre! 😢 I'll give it a try tho. Still got to prep some slides as well for #frontmania

I'm at our campus in Utrecht and I feel like I'm being watched 👀

Inktober 5: smack... It's a fly that got smack(ed) #inktober

Inktober 4: cactus #inktober

Home after a fantastic evening yesterday at #fronteers #darkmode. Seeing many people from the dev community is not just fun and education. At this point in time a bit healing as well. Such a great event. Huge thanks to the speakers, the crew and the attendees. Top notch! @fronteers.bsky.social

Inktober 3: miniature. I went for a tiny bird on this one. Also... My first Bird. #inktober

It's been far too long since I saw a talk from @heydonworks.com looking forward to this! Let's go! Last talk at #fronteers #darkmode

Time to dive into the Audio API with @anjana.dev showing how sounds work using webaudio.studio #fronteers #darkmode

Mr. @tunetheweb.com starting off the second half of Fronteers, showing us how to use declarative partial updates 💯 #fronteers #darkmode

Lacked a bit of time but since we're in a break of fronteers. Inktober 2: relic #inktober circle is wrong. I'll redo it sometime. But a fun challenge to try things out.

Next up, @cydstumpel.nl on scroll driven animations, view transitions and a quick glimpse to scroll triggered animations. #fronteers #darkmode

We started with @csswizardry.com with a message on embracing the platform and progressive enhancements. Always bet on the web! #fronteers #darkmode

Let's go! Fronteers dark mode!