CSS State Machine

For years, managing UI state on the web usually meant reaching for JavaScript. But in 2026, CSS has quietly become a state machine of its own. Pseudo-classes track interaction. Media queries read the environment and user preferences. :has() observes the DOM tree. Container queries respond to size, style, scroll position, and even anchor placement. Scroll-driven and scroll-triggered animations react to where the user is on the page. And with sibling state, CSS can now respond to what's happening next door. In this atypical overview talk, you'll get a practical tour of the CSS features that let you keep and respond to state — from things you can ship today to the cutting-edge stuff landing in browsers right now. Welcome CSS, to the state machine.