Stacy Kvernmo

The CSS is Awesome Game show was a blast and I am so thankful for our contestants and all who helped make it happen: @castastrophe.bsky.social, @davatron5000.bsky.social, @nerdy.dev, @miriam.codes, @chriscoyier.net and @oddbird.dev If you missed it, here's the video www.youtube.com/watch?v=xcEn...

@miriam.codes and I will be live on Winging It, checking out browser inspectors to see if we can find some hidden gems and generally helpful tools. Join us in 30 minutes (1pm Eastern) or watch later. What's your favorite browser inspector tool? www.youtube.com/watch?v=INqy...

Next week, @stacykvernmo.com and I will be looking at dev tools again – talking about which browser we go to in which situations. Is there an inspector feature that you'll always switch browsers to use? Let us know! And join our live stream for an overview: www.youtube.com/watch?v=INqy... #css

Winging It starts in 4 minutes and @miriam.codes and I will take a close look at the shiny new grid-lanes feature in CSS. www.youtube.com/watch?v=siSC...

Have you played with grid-lanes yet? What tips do you have for @miriam.codes and I as we learn more about this on the next Winging It on June 18 at 1pm ET

In 45m (11am MT) I'll be Winging It with @stacykvernmo.com for a look at #CSS shorthands, how they work, when to use them, and some ways they might surprise you. It's a side-quest that will be bonus material in my upcoming course – early bird signup available soon! www.youtube.com/watch?v=NX7E...

Next Thursday I'll be Winging It with @stacykvernmo.com for a look at #CSS shorthands, how they work, when to use them, and some ways they might surprise you. Keep an eye out! www.youtube.com/watch?v=NX7E...

On Winging It today, @jamessw.com, @miriam.codes and I will go over some dos and don'ts of CSS Anchor Positioning. Send us your questions and join us at live 1pm ET www.youtube.com/live/OEvVW4w...

Winging It live stream on Thursday with @jamessw.com and @stacykvernmo.com to explore some hidden gems of UI development—from @starting-style for smoother entry transitions to AVIF images and using the browser’s built-in lazy-loading. join us! www.youtube.com/live/XOm3vEJ...

On Feb's Winging It show @stacykvernmo.com, @miriam.codes, and @jamessw.com demoed how to build a type scale for your website, including: How to work with user default font size How the fonts respond to viewport sizes How to generate a ‘scale’ of relative font-sizes www.oddbird.net/2026/02/19/w...

Here are a few things I plan to cover in the Poetic #CSS course, but I'd love your input and questions! Where are you having the most issues, what piques your curiosity, and where do you have questions? Feel free to vote for multiple in the replies, or suggest other topics & specific questions.

Responsive type doesn’t have to be complicated. @miriam.codes will show @jamessw.com and me how we can get great results from a few lines of readable code on the next Winging It on Thursday, February 19 at 1pm ET www.youtube.com/live/B-r6wem...

Anchor positioning is undeniably awesome. What is missing from our awesome list? github.com/oddbird/awes...

I love WordPress, but I am constantly wondering who wants to write their CSS in a json file? I use a separate style.css and wonder if I should ONLY have color, font size, and spacing tokens in there as opposed to even some style setting defaults like post title sizes. I'm curious what others do.

Join @chriscoyier.net, @miriam.codes and me for Winging It today where we will discuss CSS scope and mixins! Send me your questions below or join us live at 1pm ET. www.youtube.com/live/T-X641Q...

We're excited to have @chriscoyier.net with us on the next Winging It live stream, to talk about CSS Scope (now Baseline newly available) and Mixins (in progress). Hope you'll join us for the conversation! Thursday, Jan 22 @ 1pm ET / 11am MT youtube.com/live/T-X641Q...

We're playing the CSS is Awesome Game again this year – run by @stacykvernmo.com, with @davatron5000.bsky.social, @castastrophe.bsky.social, @nerdy.dev, and myself as competitors. Join us, and play along in the chat! #css youtube.com/live/xcEnjGP...

The CSS is Awesome Game is TOMORROW and we are excited to announce that @davatron5000.bsky.social will be joining us. Don't miss the live stream on Thursday, December 18 at 1:00PM ET www.youtube.com/watch?v=xcEn... Our CSS survey is still open and we'd love your help tally.so/r/QKoaEY

The CSS is Awesome Game is Thursday and this year @castastrophe.bsky.social will be joining us! Don't miss the live stream on Thursday, December 18 at 1:00PM ET www.youtube.com/watch?v=xcEn... Our CSS survey is still open and we'd love your help tally.so/r/QKoaEY

The CSS is Awesome game is less than a week away and we are pleased to announce that @nerdy.dev will be joining us for the festivities! If you love CSS as much as we do, then we hope you will watch and play along on Dec 18 at 1pm ET www.youtube.com/watch?v=xcEn...

The CSS is Awesome Game is coming up on Winging It and our first special guest joining @miriam.codes and me is @chriscoyier.net Join us Thursday, December 18 at 1:00PM ET: www.youtube.com/live/xcEnjGP... We'd love your help by filling out our 5-question CSS survey! tally.so/r/QKoaEY

When I resize the browser, I'm managing space. When I zoom in, I'm trying to re-size text. Those are very different goals, but look identical in CSS. Using vw or at-media: bigger px == fewer px. If we mess with font-size for one, it applies to both: codepen.io/miriamsuzann...

The CSS is Awesome Game on Winging It is coming up soon and we would love your help. We made a 5-question CSS-based survey if you have a minute to spare. We are excited to include more audience participation this year. tally.so/r/QKoaEY

If you missed it live, you can watch @jamessw.com & @miriam.codes's chat with @meyerweb.com about Anchor Positioning now on the Winging It show. Includes: -Rough edges -Emerging patterns -Will Anchor Positioning be baseline? -What's next for Anchor Positioning? www.oddbird.net/2025/11/20/w... #css

There are many goodies that are newly and widely available in Baseline. backdrop-filter is so much fun to work with and I am obsessed with AVIF images and the ability to animate from display: none with @starting-style. And how easy is it to lazy load images now? web.dev/articles/bas...

Winging It E25 @stacykvernmo.com, @sondrae.bsky.social and @clayton.social.coop.ap.brid.gy debate thorny #UX design questions in costume. www.oddbird.net/2025/10/23/w... - Complex navigation - Ever a case for infinite scroll? - Pagination or load more button? - Click to open or hover? - Truncatio…

If you missed it, @sondrae.bsky.social and I chatted with @clayton.social.coop.ap.brid.gy about how to solve some of our current UX challenges. We also gave some free design advice and discussed what grinds our gears as designers. www.youtube.com/watch?v=2RcF...

Between the time we launched the original Learn CSS course on web.dev and today, container queries landed in browsers and became Baseline Widely available! It was high time for an update, and we were lucky enough to have the team at OddBird work with us. Enjoy 9 new modules! web.dev/blog/learn-c...

As we tiptoe towards anchor positioning becoming baseline with the upcoming release of Firefox 145, there has been a flurry of updates and improvements. Here's a few things you should know.

I'm really excited for a future with CSS Mixins and Functions. @oddbird.dev has some great content on these features if you want to browse our collection: www.oddbird.net/tags/css-mix... What are you most excited about?

In this month's OddNews, @miriam.codes intros new options to help developers dealing with tech debt & tedious maintenance tasks. @stacykvernmo.com demos The BEST way to work with shape-outside. Learn about Poetic #CSS, and subscribe to OddNews for a discount on consulting. www.oddbird.net/oddnews/

Color fonts are really interesting. You can see the font-palette options using a tool like wakamaifondue.com or the type designer's site is often helpful. You can even animate between font-palettes codepen.io/stacy/pen/vE... Unfortunately, COLRv1 has limited support caniuse.com/colr-v1

Tip: When you're using anchor positioning, consider how scrolling or screen size might make your positioned element overflow, and then add a backup with `position-try`. Get more tips by signing up for my free weekly course on anchor positioning!

Today feels like a good day to make this announcement. We got a puppy.

In the latest Winging It, @miriam.codes & @stacykvernmo.com chat with #CSS expert @kizu.dev about how to create reusable and flexible CSS using mixins & functions, what happened in the CSSWG meetings, and what's coming in CSS! www.oddbird.net/2025/08/27/w... If you like the show, please subscribe!

Accessibility is one of those things that can feel a bit overwhelming when you start learning about it, so I had a conversation with @sarasoueidan.com where we talked all about it, including what it is, why it matters, how to get started learning more about it, and a lot more. youtu.be/ndGKjhzmLXc

Please stop inheriting the box-model. The supposed use-case for that is extremely out-dated, inheritance doesn't really help, and it actively makes real box-sizing use-cases more difficult! This #CSS best practice was never the best to begin with: www.oddbird.net/2025/09/04/b...

Tip 1: If you're using anchor positioning in a reusable component, add an anchor-scope to the component to help your positioned element find the right anchor. Tip 2: Sign up for my free email course on anchor positioning .

I'll be Winging It live with @kizu.dev & @stacykvernmo.com in an hour (11am MT) to talk about future #CSS features like mixins, functions, and masonry! youtube.com/live/ER4APBN...

I went down a rabbit hole trying to understand and visualize how fluid typography calculations work in #CSS. Here's a video and interactive codepen with the results: www.oddbird.net/2025/08/26/t... Adjust the values to see how they impact the rate of change, the viewport-size range, and page zoom!

I wanted to play with some CSS trig functions and found you can calculate the width of a scrollbar in CSS when using container queries and registered custom properties. There’s so much more you can do, but here’s a little demo: codepen.io/stacy/pen/Qw...

When the CSS Working Group gets together for a face to face, the CSS meeting bot is busy and lots of Github issues get updated. If you can't keep up with it all, join Roma Komarov, @miriam.codes and @stacykvernmo.com as they recap the highlights on this month's Winging It.

There are so many CSS features rolling out these days but not enough time to experiment myself with everything. That’s why I’m loving @jamessw.com's arbitrary striped table CodePen demo using the new sibling-index() function codepen.io/jamessw/pen/...
 Currently on Chrome & Edge 138+

I love seeing the different stylistic alternates, ligatures, and swash variations of a typeface. I will often fork this pen and swap out the font-family variable to get a quick overview of what is available. I also have a version that will display numeric variants as well. codepen.io/stacy/pen/dP...

When you use position-area, you're actually creating a new containing block for your positioned element. Learn more about how this makes anchor positioning just work in many situations in my email course here - oddbird.dev/learn/course...

One of my favorite color updates in CSS is to use the relative color syntax to go from one color to another. When pairing with custom properties, you can create useful and reusable variants of your brand colors while keeping the relationship to the original color. codepen.io/stacy/pen/gb...

Dig into #CSS Container Queries with @miriam.codes & David Herron at OddBird: Container Queries Videos youtube.com/playlist?list=PL4jAKUtAhpHkH3DMK8JNVPDjvKljPkNVU For a Better Web oddbird.net/2025/04/08/better-web-8/ Container Queries: A Quick Start Guide oddbird.net/2021/04/05/containerqueries

We created Susy for CSS layout on 13 July, 2009 – 16 years ago! – & deprecated the project in 2020. But the Susy pages are still our most visited content on the @oddbird.dev website. If you're interested in learning modern #CSS approaches, I'm working on a course: www.oddbird.net/learn/course...