# SwiftUI .snappy: CSS linear() spring, stiffness 157.91 damping 21.36

> SwiftUI .snappy as a CSS linear() spring: stiffness 157.91, damping 21.36, settles in 0.7 s, overshoots 0.6%. Copy the CSS and the Web Animations line.

Canonical: https://vawe.dev/springs/swiftui-snappy
Last updated: 2026-11-04

Stiffness 157.91, damping 21.36 and mass 1 give a damping ratio of 0.85, so the spring is underdamped. It settles to within 0.1% in 0.7 s. It passes the end value by up to 0.6% at 0.474 s and crosses it 1 time.

Its base bounce of 0.15 gives a damping fraction of 0.85.

| Measure | Value |
| --- | --- |
| Stiffness | 157.91 |
| Damping | 21.36 |
| Mass | 1 |
| Damping ratio | 0.85 (underdamped) |
| Settle time | 0.7 s |
| Overshoot | 0.6% |
| Crosses the end value | 1 |
| 50% of travel at | 0.123 s |
| 90% of travel at | 0.254 s |

## CSS linear()

```css
transition: translate 700ms linear(0, 0.0057, 0.0213, 0.0451, 0.0754, 0.1106, 0.1497, 0.1915, 0.235, 0.2796, 0.3245, 0.3691, 0.4132, 0.4561, 0.4978, 0.5379, 0.5762, 0.6127, 0.6472, 0.6797, 0.7102, 0.7387, 0.7652, 0.7898, 0.8125, 0.8334, 0.8526, 0.8701, 0.8861, 0.9006, 0.9137, 0.9256, 0.9362, 0.9457, 0.9542, 0.9618, 0.9685, 0.9744, 0.9796, 0.9841, 0.988, 0.9914, 0.9943, 0.9968, 0.9988, 1.0006, 1.002, 1.0032, 1.0041, 1.0049, 1.0054, 1.0058, 1.0061, 1.0062, 1.0063, 1.0063, 1.0062, 1.0061, 1.0059, 1.0057, 1.0054, 1.0052, 1.0049, 1.0046, 1.0043, 1.004, 1.0038, 1.0035, 1.0032, 1.003, 1.0027, 1.0025, 1.0023, 1.0021, 1.0019, 1.0017, 1.0015, 1.0014, 1.0012, 1.0011, 1);
```

## Web Animations

```js
el.animate({ translate: ['0 0', '240px 0'] }, { duration: 700, easing: 'linear(0, 0.0057, 0.0213, 0.0451, 0.0754, 0.1106, 0.1497, 0.1915, 0.235, 0.2796, 0.3245, 0.3691, 0.4132, 0.4561, 0.4978, 0.5379, 0.5762, 0.6127, 0.6472, 0.6797, 0.7102, 0.7387, 0.7652, 0.7898, 0.8125, 0.8334, 0.8526, 0.8701, 0.8861, 0.9006, 0.9137, 0.9256, 0.9362, 0.9457, 0.9542, 0.9618, 0.9685, 0.9744, 0.9796, 0.9841, 0.988, 0.9914, 0.9943, 0.9968, 0.9988, 1.0006, 1.002, 1.0032, 1.0041, 1.0049, 1.0054, 1.0058, 1.0061, 1.0062, 1.0063, 1.0063, 1.0062, 1.0061, 1.0059, 1.0057, 1.0054, 1.0052, 1.0049, 1.0046, 1.0043, 1.004, 1.0038, 1.0035, 1.0032, 1.003, 1.0027, 1.0025, 1.0023, 1.0021, 1.0019, 1.0017, 1.0015, 1.0014, 1.0012, 1.0011, 1)', fill: 'both' });
```

## In a vawe page

```js
import { spring, springDuration, springLinear } from '../../core/motion/springs.js';

const k = 157.91, d = 21.36;

// per-frame code (window.seek, vawe.onFrame): t is seconds since the move starts
const x = 240 * spring(t, k, d);

// CSS and Web Animations: 700 ms, the linear() string above
el.animate(
  { translate: ['0 0', '240px 0'] },
  { duration: springDuration(k, d) * 1000, easing: springLinear(k, d), fill: 'both' },
);
```

## Source of the numbers

.snappy: duration 0.5, base bounce 0.15 (Apple: "small amount of bounce"). SwiftUI documentation read on 2026-11-03, Animation.snappy(duration:extraBounce:) (https://developer.apple.com/documentation/swiftui/animation/snappy(duration:extrabounce:)). Conversion: stiffness = (2 pi / response)^2, damping = 4 pi x dampingFraction / response, with mass 1. The duration-and-bounce forms map to response = duration and dampingFraction = 1 - bounce, the same bounce mapping Motion documents "as SwiftUI does". Apple states bounce 0 is critically damped and bounce 1 is undamped.

## Related

- [SwiftUI spring()](https://vawe.dev/springs/swiftui-spring)
- [react-spring default](https://vawe.dev/springs/react-spring-default)
- [vawe default](https://vawe.dev/springs/vawe-default)
- [react-spring gentle](https://vawe.dev/springs/react-spring-gentle)
- [All spring presets](https://vawe.dev/springs)