Session
Kinetic CSS, a deep dive into modern Motion APIs
What if, in the future of web motion, JavaScript were no longer needed? Spoiler: that future is today. Over the last few years, CSS has received a legendary power-up. It can now animate, react, and choreograph entire scenes without touching a single script. In this talk, we'll explore how to bend reality using only HTML and CSS, no frameworks, no npm madness, just pure motion expressed through brain bending style.
We'll discover how @property can be used to create truly animatable variables, and how @function together with if() allows logic and reactive math to live directly inside your stylesheets. We'll use @starting-style to craft cinematic enter animations, while combining @view-transition, @scope, and @container to design modular motion systems that adapt to context. All of this will come together through smooth, scroll-driven animations that make the interface feel alive. Along the way, we'll count elements dynamically with sibling-index() and sibling-count() to synchronize timelines, and we'll rely on individual transforms like rotate, translate, scale, and skew, enhanced by anchor positioning, typed values, and trigonometric functions that turn geometry into visual poetry.
It’s no longer about decoration, it's about choreography.
This is CSS that moves, thinks, and breathes.
The art of JS-free motion, where HTML breathes... CSS dances... It’s no longer about decoration, it's about choreography.
This is CSS that moves, thinks, and breathes.
Emiliano Pisu
Senior Design Engineer, Sensei & Co-Host @ DevDojoIT
Rome, Italy
Links
Please note that Sessionize is not responsible for the accuracy or validity of the data provided by speakers. If you suspect this profile to be fake or spam, please let us know.
Jump to top