James Stuckey Weber

Too Much Color I spent too much time looking at too many colo(u)rs to try and optimise them for csskit. Here are some interesting findings.

I spent too much time looking at too many colo(u)rs to try and optimise them for csskit. Here are some interesting findings.

www.keithcirkel.co.uk/too-much-col...

What's My JND? Find your Just Noticeable Difference in colour perception. How small a colour difference can you actually see?

For those who want to test their perception of colour, I made a little game called "What's My JND"

www.keithcirkel.co.uk/whats-my-jnd...

One day you're like "we should send a weekly newsletter about the cool stuff on @codepen.io and around".

Then 500 weeks go by. 🎉

codepen.io/spark/500

Tools also avoid rounding to prevent color shifts if you convert between spaces repeatedly, so they likely preserve more than is needed.

Thank you for doing the math! I'm curious if that holds up across channels? I'm guessing some color spaces would also show more differences in some hues?

Or perhaps nuance isn't really needed here... 3 is sufficient, and likely more than sufficient, and 4 is never needed?

Container Queries and Units in Action One of the goals when writing CSS is to build component parts that will adapt well to different (and unexpected) contexts. Ideally, a component can be placed inside any "container" element without it ...

Explore Container Queries with @miriam.codes in the context of the delicious Baseline Bakery. Donuts & #CSS? Yum!
www.oddbird.net/2026/02/18/q...

Shared in the February issue of OddNews:
us19.campaign-archive.com?u=80219aa68d...

You can find the slides of my #SotB2026 talk on my blog: www.bram.us/2026/02/28/a...

Select flip ...

Played around with a polyfill for Element.matchContainer() and it works! Just needed to tweak the polyfill with a @starting-style. codepen.io/jamessw/pen/...

Looking forward to the "State of" trench coat to replace the t-shirts next year.

Why is Anchor Positioning not working? Learn the edge cases that prevent anchor positioning from working correctly.

💡 CSS Tip!

For years, we've had the "z-index, stacking context" nightmare, but we will soon have a worse nightmare related to Anchor Positioning 😱

When it doesn't work, it's frustrating, so it's time to learn how it really works.

css-tip.com/anchor-issues/

It's not as simple as you might think!

That seems like a very reasonable thing to want, but not sure how to do that without causing cycles.

I haven’t played with Container Queries for anchors much yet, but my understanding is no.

Responsive Type Doesn’t Have To Be Complicated YouTube video by Winging It

Tomorrow on Winging It (live) I'll be chatting with @stacykvernmo.com & @jamessw.com about my approach to responsive type in #CSS – without third-party calculators or complex unit conversions – and some of the research I did to get there.

Join us at 10am PT/1pm ET!

www.youtube.com/live/B-r6wem...

It was too icy to run, so instead I wrote a blog post. Some thoughts about the new problems generative AI introduces in the content operations pipeline, and why my spidey-sense for plagiarism is broken rachelandrew.co.uk/archives/202...

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 YouTube video by Winging It

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...

Better Anchor Positioning with position-area It's not just a shorthand for anchor()

Curious how 'position-area' works? It's more than a shorthand for anchor().

Implicit anchor association Demonstrating **implicit anchor positioning in CSS**, where the browser automatically creates an anchor relationship between elements based on their se...

Demonstrating Implicit anchor association on @codepen.io
The browser automatically creates an anchor relationship between elements based on their semantic connection. Without you explicitly defining an anchor-name position-anchor pair.
Best hidden feature of CSS Anchor.
codepen.io/g12n/details...

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

<details>: The Details disclosure element - HTML | MDN The <details> HTML element creates a disclosure widget in which information is visible only when the widget is toggled into an open state. A summary or label must be provided using the <summary> eleme...

If you look at MDN, the first is rendered correctly but the remainder are emoji. developer.mozilla.org/en-US/docs/W...

I feel like I saw someone reporting this as a bug recently, and it changes if you have multiple detail elements on the page

I love this pattern for projects that don't want to use Typescript, and even enable 'checkJS' in the jsconfig.json instead of ts-check on individual files.

Also great tip on infer vs input!

Imagine CSS without inheritance A code demo by Miriam Suzanne created on CodePen

While working on her Poetic CSS video course, @miriam.codes created a little demo to imagine CSS without inheritance. Read her thoughts and play with the demo in this month's issue of OddNews.

Read OddNews: us19.campaign-archive.com?e=%5BUNIQID%...

Code: codepen.io/editor/miria...

#css

CSS Scope & Mixins YouTube video by Winging It

Looking forward to learning about CSS scope and mixins from @chriscoyier.net with @miriam.codes and @stacykvernmo.com on Winging It Live- tomorrow at 1 ET.

nth-child was upgraded YouTube video by Kevin Powell

:nth-child() was upgraded (a long time ago, but no one seems to know about it)

youtube.com/shorts/rep-C...

CSS anchor positioning is newly baseline! This opens the door for lots of new creative CSS.

It's a huge feature, but here are the basics.

Create Performant Layouts and Resilient Dropdowns This CSS anchor positioning course teaches you how

Anchor positioning is now available in Firefox! If you've been holding off on learning it, now is a great time to dive in. Sign up for my free email course to learn how to use this powerful tool today.

2026 CSS wishlist: this year I’ve focused on the key features that I believe will enable us to create better design system DSLs with CSS, as well as, follow separation of concerns in a renewed way. What would you like to see for CSS this year?

knowler.dev/blog/2026-cs...

Happy new year (derogatory)