Link to my slides for my talk at @cascadiajs.com https://nerdy.dev/cascadiajs-2025-talk

deployed a `scroll-target-group` and `:target-current` #CSS scroll spy upgrade from the scroll driven animation variant that was a little uncanny to my site, now it's always right read about the feature from @una.im una.im/scroll-targe... try it here in Canary nerdy.dev/cascading-se...

Rolled my own Twitter API aggregations, so posts can now show engagement from that platform again 🤘🏻💀 https://nerdy.dev/twitter-integrated-again

Me 🤝 Shopify https://nerdy.dev/joining-shopify

🆕 ep #209 on https://whiskey.fm Is Cracker Barrel a JS Framework? JS trends, overused hooks, frameworks chasing sameness, why Cracker Barrel's rebrand felt like a NPM package metaphor, retro console nostalgia, LAN parties, and plenty of other delightful whatnot! 🥃 https://nerdy.dev/www-ep209

Here's a #css study list, 100+ features to checkout from the past ~5 years. There're surprises in here for even the most knowledgeable front-end developer! https://nerdy.dev/cascading-secret-sauce

I've joined Whiskey Web and Whatnot as a permanent show host! I'll be bringing #css content and overall more dorky nerdery to the pod. Tune in if you're into (web tech news || whiskey || whatnot) https://nerdy.dev/www-ep208

TIL how to set keyframe offsets in JS WAAPI animations been using them for a long time in CSS, but needed them in my JS today, somehow for the 1st time 🤔 https://nerdy.dev/keyframe-offsets

gradient.style has finally - come out of beta - offers multiple background editing - is open source 🎉 https://nerdy.dev/gradient.style-is-out-of-beta

The making of a #css5 HDR enabled gradient tool a fun peek into the sketching that led to the gradient line UI, the color picker, the overall layout, some math and more! https://nerdy.dev/the-making-of-gradient.style

Insights into my developer AND designer tooling endeavors over on @devtoolsfm ⤷ https://nerdy.dev/devtools-fm-151

#css ✅ contrast-color() ✅ control-value() ✅ sibling-index() ✅ scroll-state() ✅ mixins/functions ✅ @starting-style We chat these and much more over on the @workingdraft show ⤷ https://nerdy.dev/working-draft-show-revision-672

Making sure JS devs aren't installing packages for features that are now 1 line of CSS https://nerdy.dev/css-at-cascadiajs-2025

I'll be your huckleberry; when you need someone who does both. https://nerdy.dev/systems-and-users

VisBug comes preinstalled in the Orion browser 🤘🏻💀 https://nerdy.dev/orion-ships-with-visbug-as-the-design-tools

a quick prototype sprint on an LLM chat interface ✅ view transitions ✅ readablestreams ✅ flow control ✅ light/dark https://nerdy.dev/llm-chat-prototype

`-webkit-focus-ring-color` `-moz-focus-ring-color` ^ the adaptive "system variable focus outline" color you can use to look integrated when using `color-scheme: light dark` would be nice to not have the prefix, just be part of this https://developer.mozilla.org/en-US/docs/Web/CSS/system-color

some of my UI work https://nerdy.dev/sizzle-rizzle

Photos of @[email protected] giving a talk on the first day of #cssday (5 June 2025). 📷 OM-3 & 75 mm ƒ1.8

Recreating the Nintendo Switch Homescreen scroll UX - 90% done with CSS - a li'l JS for sounds, vibrations n' taps https://nerdy.dev/nintendo-switch-homescreen-css-recreation

It's not a challenge to design for reduced transparency, it's an opportunity. https://nerdy.dev/prefers-reduced-transparency - adaptive frosted glass - adaptive captions

I'm still sad that the native CSS color functions do not work like in preprocessors in certain aspects, but with custom functions, we will be finally free @function --rgba(--c <color>, --a: 1) { result: rgb(from var(--c) r g b / var(--a)); }

#cssday: ya gonna be there? https://nerdy.dev/off-to-css-day-2025

No job? Find a friend with a boat. https://nerdy.dev/mt-rainier-boat-banjo

https://codepen.io/kizu/pen/qEddYOO code { --captured-length: 100cqi; --captured-length2: 20ch; --ratio: tan(atan2( var(--captured-length), var(--captured-length2) )); tab-size: round(up, var(--ratio), 2); }

```css textarea { scrollbar-width: thin; } ``` thoughts?

3 Unintuitive #css Layout “Solutions” ``` min-width: 0? flex-shrink: 0? repeat(auto-fill, minmax(min(10rem, 100%), 1fr)) ``` wat? https://nerdy.dev/3-unintuitive-layout-solutions

workin on the design for my slides at CSS Day 3D view transitions between pages/slides? li'l bit-o-glitch and some split text. i'm diggin it.

Tag I'm It a blog post about blogging https://nerdy.dev/blogging-about-blogging

S2E2 - WebDev Challenge @wagslane and I team up and rock vanilla Go, CSS and some JS glue to make a flappybird-like game you control with your face. https://nerdy.dev/webdev-challenge-s2e2

got tired of seeing fugly `<details>` try this one https://nerdy.dev/nice-details

while on garden leave… I suppose I'll tend to a #css Zen Garden ⤷ https://nerdy.dev/zen-garden-leave

G̶o̶o̶g̶l̶e̶r̶… ex-Googler. https://nerdy.dev/ex-googler

Smells like an attack vector for people into that

#css `::scroll-button()`, `::scroll-marker`, Carousel Configurator, and Carousel Gallery with @chriscoyier and @davatron5000 on @shoptalkshow! https://nerdy.dev/carousels-on-shoptalk

Not a joke: CSSWG has resolved to start working on fit-to-width text in css-fonts-5! https://github.com/w3c/csswg-drafts/issues/2528#issuecomment-2769621512 #css #typography

`<span>` more like `<spandex>`

okLCH explosions https://codepen.io/argyleink/pen/dPyqgoe

new Notebook - #css relative color https://nerdy.dev/notebook/relative-color.html

i'm looking for a **CSS typography history timeline** or even like a collection of when each CSS typography feature came out and in what year… got any leads for me? doesnt need to be exhaustive, but thorough would be appreciated

Time to kick the tires on the #css `@mixin` prototype in Canary ⤷ https://nerdy.dev/css-mixins-ready-for-experimentation

wow, even getting spam DMs here on Mastodon now… DMs sharing ASL for no reason, def not suspicious

in Chrome 135 - Tomorrow Mar 26, 2025 customize all the parts of a `<select>` with #css! ⤷ https://nerdy.dev/customize-a-select

#css only carousels arrive in Chrome 135 ⤷ https://nerdy.dev/css-carousel-in-chrome-135

Rainbow drop shadow? I gotchu. ⤷ https://nerdy.dev/rainbow-shadow-button

like a moth to the flame, companies are pulled to changing button styles

CSS, rad folks, virtual attendance? Smashing Meets #css: @smashingmag ⤷ https://nerdy.dev/smashing-meets-css-2025

#css layers, "they're dope" - CodeTV with Jason Lengstorf https://youtube.com/clip/UgkxtpcRAWyFng5dQ4Ks8fj1xL41zjlIdc7P?si=A1NIsJzF8Zx_ZOLF

amazing what a few lines of #css can do https://codepen.io/argyleink/pen/LEYOgxy

#css sibling-index() and sibling-count() available Chrome Canary with experiments enabled! `transition-delay: calc(sibling-index() * .1s);` or ```css --hue: calc(sibling-index() * 50); color: oklch(70% 70% var(--hue)); ``` more info and a Codepen to fork ⤷ https://nerdy.dev/sibling-index