QQ about Dark Mode Toggles on websites How many options do you show to users? - Three values: System, Light, or Dark - Two values: Light, Dark (with one of them mapping to “System” behind the scenes). Why the one or the other? (I have an opinion about it, but I’m looking for external input)

F is my personal favorite design for tve future Euro bank notes... What about you? www.ecb.europa.eu/euro/banknot...

Future banknotes

The European Central Bank (ECB) is the central bank of the European Union countries which have adopted the euro. Our main task is to maintain price stability in the euro area and so preserve the purch...

ecb.europa.eu

Keep learning, even on vacation 🏝️

Chris Coyier@chriscoyier.net · 2w ago

I didn't realize that if, say, you have a `box-shadow`, then a @keyframes animation applied to the same element and also applied a `box-shadow`, you can get them to stack on top of each other with `animation-composition`. master.dev/blog/using-a...

Discovered that aria-describedby doesn't work on VoiceOver in Firefox or Safari unless the element with the attribute has a role like image/link/button or it's a form field. bugzilla.mozilla.org/show_bug.cgi... bugs.webkit.org/show_bug.cgi...

Accessibility progress starts with small wins. Fix one barrier today. Momentum follows. www.dennisdeacon.com... #Accessibility #DigitalAccessibility #A11y #InclusiveDesign #UXDesign #WCAG #AccessibilityTesting #UserExperience

Quick Wins That Move Accessibility Forward - Fast - Dennis Deacon

Quick accessibility wins that improve usability fast, from alt text to keyboard access, with practical fixes you can apply today.

dennisdeacon.com

📝 New CSS Article! The sibling-index() function lets you get the index of an element among its siblings, but it has a hidden superpower! Read my latest article to know about it 👇 master.dev/blog/in-n-ou...

In-N-Out Animation using sibling-index()

Temani mimics a View Transition by placing items using their index and translations. The placement calculation change when the index changes, which is an animation opportunity!

master.dev

🔥 New blog post: In defense of polyfills A highly influential spec editor expressed the opinion that polyfilling is harmful. I beg to differ. lea.verou.me/blog/2026/po...

In defense of polyfills • Lea Verou

An influential spec editor thinks polyfilling is harmful. I think blaming polyfills for compat accidents is like blaming car crashes on the ambulances that show up — and the alternative is a stagnant ...

lea.verou.me

My colleague Julia Undeutsch built "Div & Die": a game where players must guide a blind pedestrian across a street. Because the map uses only generic <div> tags, screen readers can't detect the tactile guidelines or white cane cues. A perfect look at why semantic code is vital!

Adding proper arrow-key navigation to custom UI used to require tedious event handling. I’ve been experimenting with the new focusgroup API, and the simplicity is incredible. You get native, accessible UX out of the box while deleting custom JS. My first deep dive: th3s4mur41.me/blog/focusgr...

Focusgroup: The Future of Keyboard Navigation

Chrome and Edge 150 shipped native focusgroup support — an HTML attribute that brings arrow-key navigation to the browser, with automatic ARIA roles and a polyfill available today.

th3s4mur41.me

Just published a blog post about the new CSS Anchor Positioning API! ⚓ I’ve been learning about it over the past few weeks, and it’s friggin’ great, but it also took me a minute to really get the hang of it. My goal in this post is to share the most useful bits, so you can start using it today. 🔥

Getting Started with Anchor Positioning • Josh W. Comeau

For decades, one of the most notoriously-challenging problems on the web has been sticking one element to another element, for things like tooltips and nested menus. The CSSWG has decided to provide a...

joshwcomeau.com

Ready to crush the Aachener Firmenlauf! 🏃‍♂️ The energy at the starting line is amazing. Let’s see what these legs can do. If you’re here, give a wave! 👊

Last month, I was speaking at @cssday.nl on the new <meta name=text-scale> tag. I've just published a blog post with my slides and summary. www.joshtumath.uk/posts/2026-0...

This post is a follow-up on my previous post. I was wondering whether it's safe to use Grid Lanes today. I came up with a solution I find okay, but there is a caveat. matuzo.at/blog/2026/gr...

Progressively enhancing Grid Lanes

This post is a follow-up on my previous post. I was wondering whether it's safe to use Grid Lanes today. I came up with a solution I find okay, but there is a caveat.

matuzo.at

There's an ideal set of sizing constraints for custom <select>, but the CSS is a bit tricky. Here's how to make it work, and a tour of new CSS features along the way. jakearchibald.com/2026/goldilo...

The Goldilocks customizable select height

The 'ideal' sizing is more complicated than you think…

jakearchibald.com

⚡Featured posts this week: ✨ CSP Playground: @therealnooshu.bsky.social ✨ Cross-Origin Storage: @tomayac.com ✨ Is my website agent-ready?: @mhablich.bsky.social ✨ href='#' and the Focus Trap: @th3s4mur41.me 🙏 Special thanks to the authors! #webperf

Alignement on the stacking axis is gonna bring some nice layout opportunities 🤩 patrickbrosset.com/articles/202...

Patrick - Alignment in CSS Grid Lanes

One part of CSS Grid Lanes I didn't talk about during my presentation at CSS Day is how alignment works. In this article, let's quickly go over how alignment will eventually work in CSS Grid Lanes.

patrickbrosset.com

We're at 4844 responses for this year's State of CSS survey, so I just need 157 more participants to be able to say the survey got "over 5000" responses! I'm closing the survey tomorrow so this is your last chance to learn about all the latest CSS features! survey.devographics.com/en-US/survey...

State of CSS 2026

Take the State of CSS survey

survey.devographics.com

Design systems have always intrigued me, but they are something that I don't have any experience with, so, I've teamed up with someone who does have that experience!, @michaelwarren.dev! It's still early days, but if you want updates as we work on it, sign up here: thecascade.dev/courses/desi...

Thoughtful Design Systems - a course by Kevin Powell and Michael Warren

Founded by Kevin Powell, with curated learning paths, courses, and clear explanations that will have you writing CSS with confidence.

thecascade.dev

Turns out optimizing for performance can actually harm user experience… Did you know that decoding="async" can break multipage View Transitions? #CSS #HTML #UX #WebDev

decoding=async can break multipage view transitions

Turns out optimizing for performance can actually harm user experience... Did you know that decoding "async" can break multipage View Transitions? When a view transition is triggered, the browser captures a snapshot of the new page to animate from. If an image is still decoding asynchronously at tha...

th3s4mur41.me

New Blog Post: “Do Websites Need to Function Exactly the Same on Every Platform?” www.bram.us/2026/06/21/d... (Betteridge’s Law of Headlines applies)

Do Websites Need to Function Exactly the Same on Every Platform?

While we’ve accepted that websites don't need to look the same everywhere, we seem to be stuck on a new hurdle: the idea that websites need to function the same everywhere.

bram.us

New Blog Post: View Transitions: Should you use the new `attr()` or `match-element` for the `view-transition-name`? Well … It Depends™ www.bram.us/2026/06/19/v...

View Transitions: Use the new attr() or match-element for the view-transition-name?

At CSS Day, “YouTube guy” Kevin Powell showed a lot of demos that relied on the advanced attr() function. In one of the examples he used attr() to set view-transition-name values — a technique I cover...

bram.us

As @una.im just mentioned in her #cssday talk, the CSS WG recently resolved to insert a ⓘ after EVERY SINGLE INTEREST INVOKER on touchscreens. Here’s a mock of what this would look like for bsky. This is the issue to let the CSS WG know what you think: github.com/w3c/csswg-dr...

Did you attend #CSSDay and saw my talk (or heard about it), and you really want CSS Grid Lanes to be supported across browsers? ➡️ Give this issue a thumbs-up *and* add a comment explaining your use case. This can help a lot move things forward 💟 github.com/web-platform...

Masonry · Issue #308 · web-platform-dx/developer-signals

This GitHub issue is for collecting web developer signals for Masonry. The display: grid-lanes or display: inline-grid-lanes CSS declaration creates a layout where items are tightly packed, like br...

github.com

In a world of AI-generated design systems, orchestrating the web still requires people who care. Knowing how to use smart layers, custom scrollbars, view transitions, and have accessibility on top of mind is what builds a joyful UX. 🧑‍💻 Systems should be scalable. utilitybend.com/blog/the-dea...

The death of Web UI? Bollocks! Geeking out on a better web and trying to make a difference. | utilitybend

CSS Day 2026 reminded me that Web UI isn't dead — just dormant. Why tinkering with CSS still matters in a world of AI-generated design systems.

utilitybend.com

Is your "Back to Top" link breaking your UX? href="#" might be valid HTML, but it creates a major accessibility focus desync—scrolling the screen for sighted users while trapping keyboard focus at the bottom. Read why your linter is right to hate it: th3s4mur41.me/blog/href-ha...

href="#" and the Focus Trap

An empty href="#" is valid HTML — but it scrolls the page without moving keyboard focus, silently breaking WCAG 2.4.3. Here's why, and the one-line fix.

th3s4mur41.me

Based on the feedback at @css.cafe I opened a few issues to discuss at open UI on the enhanced range inputs. I also tried to make some new examples with waves and circles. 😅 brechtdr.github.io/enhanced-ran...

YES, Dark Mode Toggles _should_ be a browser feature. I wrote about this before: brm.us/dark-mode-ov... Find the link to the Chrome Bug in the post, and hit the star next to it to "upvote" the bug. (I even have a prototype extension to provide this for you: brm.us/chrome-dark-...) #cssday

Dark Mode Toggles Should be a Browser Feature

When implementing Dark Mode and ways to toggle it, developers currently need to duplicate code and roll their own toggle implementation. What if, instead, browsers would take care of all that?

brm.us

37% of users change their text scale sizes on iOS/Android - @joshtumath.uk

I’ve upgraded my website and officially joined the cool kids club on @standard.site! My blog posts are now flying straight into the Atmosphere. 🚀

On to the Atmosphere!

I've upgraded my website and officially joined the cool kids club on standard.site! My blog posts are now flying straight into the Atmosphere. 🚀

th3s4mur41.me