Grid Lanes – The Future of Masonry Layout
This long-debated solution for masonry layout is now available and it’s time to figure out how to use it. Join us for a deep dive into the workings of Grid Lanes.

User experience designer & developer @ OddBird since
Stacy (she/her) is a user experience designer, front-end developer, speaker, and podcast superfan.
With over 15 years of experience, Stacy takes the lead on interface development, architecting accessible and maintainable HTML, CSS, and Sass. Balancing a love of design and code, she enjoys experimenting with new design processes and tools as well as new web technologies like CSS Grid Layout. Stacy is enthusiastic about teaching and speaking at design and front-end development conferences. She is a co-host of the WordPress Naperville meetup group and is a superfan of far too many podcasts.
Color contrast checker with Oklch, Oklab, P3, and more
OddContrast is a color format converter, featuring newer color formats like Oklch, Oklab, and the Display P3 color space. It’s also a color contrast checker to help designers meet WCAG 2 accessibility standards.
Popover, CSS Anchor Positioning, Cascade Layers
Along with our work for the W3C developing specifications for the CSS language, OddBird has started and maintains a number of powerful polyfills for new web platform features including the Popover attribute, CSS Anchor Positioning, and Cascade Layers.
Automated style guides
Design systems streamline development, communication, and consistency – but often rely on dedicated teams and extended budgets. We wanted a tool that helps create and maintain living style guides & pattern libraries in an agile process, and on a budget. Herman helps you keep your development process simple – and your UX consistent – as you scale over time.
Customizable web presentations
Design-token management in Sass

This long-debated solution for masonry layout is now available and it’s time to figure out how to use it. Join us for a deep dive into the workings of Grid Lanes.

CSS properties come in two excellent flavors – longhand properties have a direct impact on the element, while shorthand properties take a much more convoluted path. There’s a lot going on when we use a shorthand property, with hidden surprises, and reasons we might use one or the other.

CSS anchor positioning isn’t baseline yet, and there’s good reason for that. You can use it, but it comes with some caveats. James, Stacy, and Miriam cover new resources to make anchor positioning easier, and work through some demos to help you understand how anchor positioning works. We also look…

Hidden gems of UI development
Join Stacy, James, and Miriam as we explore some hidden gems of UI development – from @starting-style for smoother entry transitions to performance boosts with AVIF images and using the browser’s built-in lazy-loading. We cover a variety of quick wins that you can use to make your life easier and…

From image sharing sites to online stores, image galleries are a common pattern on the web. Images can be very data heavy, and loading images can make the page take a long time to load. In addition, users have high expectations around the usability of galleries, so it’s common to…

Building a type scale for your website
Miriam has spent a lot of time digging into the different approaches, the math involved, the user implications, and the ways modern CSS can help us out. There are equations and graphs! But you don’t need anything that complicated to build a type scale for your next site. With the…

A chat with Chris Coyier
At the end of 2025, Firefox added the CSS @scope rule – making the new feature available across all major browsers! Since Chris Coyier has done a fair amount of writing and speaking on the topic, we wanted to talk with him about what that means. Chris has also been…

With special guests Adam Argyle, Cassondra Roberts, and Dave Rupert
The second annual CSS is Awesome Game was a heated battle between a few of our favorite CSS professionals including Adam Argyle, Cassondra Roberts, Dave Rupert, and Miriam Suzanne. If you love CSS as much as we do, we hope you will play along and enjoy the challenge.

Managing complex navigation with guest Clayton Dewey
OddBirds, Stacy and Sondra, along with special guest Clayton Dewey of Dev Collaborative, face off against bad UX design patterns. They get into the weeds trying to address some of the thorniest, perennial UX design questions - managing complex navigation, intuitive user flow, is there such a thing as a…

With special guest Roma Komarov
The CSS Working Group got together in August to discuss a range of old and new issues. The following week, Miriam Suzanne and Stacy Kvernmo chatted with CSS expert Roma Komarov about how to create reusable and more flexible CSS using mixins and functions, what happened in the CSSWG meetings…

A guide to using new color spaces & formats with OddContrast
OddBird’s color tool not only checks contrast ratios, but supports the new CSS color formats and spaces.

CSS Q&A Party
Miriam Suzanne and Stacy Kvernmo answer questions from listeners about CSS – what the next big evolution for CSS may be, how to make a site more accessible, whether float is still useful, and what’s on their CSS wish list.

Display color gamut ranges and more
OddContrast, OddBird’s color format converter and contrast checker, gets new features – including the ability to swap background and foreground colors, and display color gamut ranges on the color sliders. Contrast ratios now incorporate foreground color alpha values.

With special guest Richard Rutter
Miriam’s been asking questions about fluid typography, and how a website design should plan for (and respond to) user preferences. And we’re not the only ones thinking about it! This month we continue the conversation with Richard Rutter from Clearleft, the experts behind excellent resources like Utopia.fyi and WebTypography.net.

With special guest Alan Stearns
Join Miriam Suzanne, Stacy Kvernmo, and special guest Alan Stearns – typography enthusiast, co-chair of the CSS Working Group, and self-described CSS Panjandrum – for a conversation about typography. Responsive Typography has been around for at least a decade in various forms, but has become even more popular with tools…

With special guests Michelle Barker, Stephanie Eckles, Kevin Powell, and Henri Helvetica
On December 17, 1996, the W3C published the first standard for CSS, and we celebrated the anniversary on Winging It! Michelle Barker, Stephanie Eckles, Kevin Powell, and Henri Helvetica joined us for our “CSS Is Awesome” game. If you love CSS as much as we do, we hope you will…

In July we talked with Stephanie Eckles about how (and why) you can get started working grids into your CSS toolkit. As requested, this is part two of our dive into CSS grids. We address your questions about strategy – demoing how we plan and apply grid layouts, starting with…

With special guest Stephanie Eckles
We talk with Stephanie Eckles – the brain behind ModernCSS.dev and SmolCSS.dev – about CSS grids. We look at a few of the most common grid patterns, to show you how (and why) you can get started working grids into your CSS toolkit!

Miriam Suzanne, Stacy Kvernmo, and James Stuckey Weber demo how to use new color formats with OddContrast, a color tool for previewing, accessibility testing, and selecting the format/space.

Miriam Suzanne and Stacy Kvernmo talk about CSS Container Queries and the unexpected things that happen when you add containment. Some elements completely collapse! What’s going on there? We had questions and thought you might too. So we talk through the issue in our monthly live stream.

For simple interactive sites, using a proxy to manage your state and side effects may be enough.

If you’ve ever found yourself in a specificity war, you’ll understand how important having control over style priority can be. During our conversation, we discussed what CSS Layers are and how you can use them in your project.

How to make the editing experience better

CSS-Tricks asked a number of web builders the same question…
“What about building websites has you interested this year?”
The role of ethics in our modern web space has been on my mind for the past few years and I suspect it will occupy my thoughts increasingly as I move forward. With each encounter of a questionable feature or setting on a website, I can’t help but think of all of the people involved and the discussions that may (or may not) have taken place.

with CSS Grid Layout and Friends


We wanted to show some love to a few great tools we use to get us through our work days. Do you have any to add to our list?

CSSDay was held in sunny Arizona on December 3, 2016. The conference is geared towards front-end developers who want to dive deeper into advanced CSS topics.

Ongoing education in our industry is a must. Attending conferences is a great way to learn and network with other industry professionals. Unfortunately, not everyone is able to attend conferences, but have no fear! Many of the best conferences post videos online, giving our community an easy way to learn…

Using an emphasized initial letter is a technique that has been used for centuries. Let’s dive in to see some ways you can apply it to your project to help guide your reader with visual hierarchy.

CSS Grid Layout is shaping up to be the layout tool we’ve always wanted on the web. How can we use it to start creating interesting layouts?

It’s easy to fall into old habits

CSS Code Reviews