November 6, 2025
Naming fights and spring vibes
Springs and Bounces in Native CSS
Dev drama: “linear()” brings bouncy CSS — and naming chaos
TLDR: CSS’s new linear() lets designers make springy, bouncy animations natively—no JavaScript needed—while commenters spar over the confusing name, ask for built‑in presets, and pitch speed‑per‑pixel timing. It matters because smoother motion with fewer performance hits is now within reach, if standards catch up.
CSS just got a new party trick: the linear() timing function that lets designers draw motion with dots, unlocking native springs and bounces without JavaScript jank. But the crowd isn’t just clapping; they’re arguing over the name. One commenter shot the first flare: “‘piecewise’ would’ve been better than ‘linear’,” sparking a naming war and spawning the Spider‑Man pointing meme: linear vs linear(). Meanwhile, the performance crowd cheered that this runs in CSS (not the app’s busy main thread), with bhollis calling it something that should be “built into the CSS standard” already. Translation: we want presets for springy motion out of the box, not DIY math homework.
Then came the feature wish list: Y‑bar pitched a speed-per-pixel timing (“1px/5ms”) so short transitions don’t feel like long ones, a practical “make motion make sense” idea that had folks nodding. And of course, pure Hacker News meta: capitainenemo slapped a “duplicate from 9 days ago” tag with a link, prompting eye rolls and déjà vu jokes. Between confusion over two “linear”s (one constant speed, one point‑to‑point curves), cheers for smoother motion, and wishful thinking for velocity-based animations, the comment section turned into a bounce-off where naming beef met performance pride.
Key Points
- •CSS linear() is a non-Bézier, piecewise-linear timing function that enables complex motion such as springs and bounces natively.
- •linear() takes a list of values between 0 and 1 (evenly spaced across the duration) and connects them with straight segments to form the easing curve.
- •Values outside the 0–1 range are allowed, enabling overshoot behavior typical of springs.
- •As of October 2025, browser support for linear() is about 88%, and it has been in all major browsers since December 2023.
- •Compared to JavaScript-based animations on the main thread, linear() can reduce performance issues by keeping animations in CSS.