彈簧動畫 → CSS linear()
重點摘要：彈簧動畫產生器用剛性（stiffness）、阻尼（damping）與質量（mass）模擬物理彈簧，轉成純 CSS linear() 緩動函式與建議時間；linear() 支援 Chrome 113、Firefox 112、Safari 17.2 以上。
用物理彈簧模擬出曲線，再轉成 CSS 的 linear()。阻尼越小回彈越多，剛性越大動作越快。
常見設定
| 感覺 | stiffness | damping |
|---|---|---|
| 柔和 | 120 | 20 |
| 俐落 | 380 | 32 |
| Q 彈 | 260 | 12 |
| 慢慢回彈 | 80 | 8 |
MDN：easing-function（含 linear()）
常見問題
stiffness 和 damping 要怎麼調？
剛性越大動作越快，阻尼越小回彈越多。本站常見設定：柔和 120／20、俐落 380／32、Q 彈 260／12、慢慢回彈 80／8（stiffness／damping）。
怎麼判斷彈簧會不會回彈？
看阻尼比：damping ÷（2 × √(stiffness × mass)）。小於 1 為欠阻尼會回彈，等於 1 為臨界阻尼，大於 1 為過阻尼不回彈；工具會顯示類型與回彈百分比。
舊瀏覽器不支援 linear() 怎麼辦？
用 @supports 判斷，不支援時提供一般 cubic-bezier 作為後備；linear() 從 Chrome 113、Firefox 112、Safari 17.2 起預設支援。
為什麼要用 CSS linear() 做彈簧？
linear() 可以用多個取樣點描出任意曲線，做出 cubic-bezier 做不到的彈簧、多次回彈效果，而且不需要載入 JavaScript 動畫函式庫。