CSS reacts, JS just listens

Headline “What JS knows, now CSS knows” next to a Live panel showing pointer.x 99% and pointer.y 24%, above cards for clock, FPS, viewport, scroll velocity, and accent hue.

Adam Argyle introduces prop-for-that, a tiny library that exposes runtime state to CSS through custom properties. Add data-props-for to an element, and CSS can read live values like pointer position, scroll velocity, battery level, network speed, viewport size, or form validation, with no event handlers or DOM manipulation. Over 16 sources are available.

prop-for-that.netlify.app