# react-spring default: CSS linear() spring, stiffness 170 damping 26

> react-spring default as a CSS linear() spring: stiffness 170, damping 26, settles in 0.705 s, no overshoot. Copy the CSS and the Web Animations line.

Canonical: https://vawe.dev/springs/react-spring-default
Last updated: 2026-11-04

Stiffness 170, damping 26 and mass 1 give a damping ratio of 0.997, so the spring is about critically damped. It settles to within 0.1% in 0.705 s. It never passes the end value.

It is the config a spring gets when you pass none. The numbers equal vawe default.

| Measure | Value |
| --- | --- |
| Stiffness | 170 |
| Damping | 26 |
| Mass | 1 |
| Damping ratio | 0.997 (about critically damped) |
| Settle time | 0.705 s |
| Overshoot | 0% |
| Crosses the end value | 0 |
| 50% of travel at | 0.129 s |
| 90% of travel at | 0.298 s |

## CSS linear()

```css
transition: translate 705ms linear(0, 0.0061, 0.0227, 0.0474, 0.0783, 0.1137, 0.1523, 0.193, 0.2349, 0.2772, 0.3193, 0.3609, 0.4015, 0.4408, 0.4787, 0.5149, 0.5495, 0.5823, 0.6132, 0.6424, 0.6699, 0.6956, 0.7196, 0.742, 0.7629, 0.7823, 0.8003, 0.8169, 0.8323, 0.8466, 0.8597, 0.8718, 0.8829, 0.8931, 0.9025, 0.9111, 0.919, 0.9263, 0.9329, 0.939, 0.9445, 0.9495, 0.9542, 0.9584, 0.9622, 0.9657, 0.9689, 0.9718, 0.9744, 0.9768, 0.979, 0.981, 0.9828, 0.9844, 0.9859, 0.9873, 0.9885, 0.9896, 0.9906, 0.9915, 0.9923, 0.9931, 0.9937, 0.9943, 0.9949, 0.9954, 0.9958, 0.9963, 0.9966, 0.997, 0.9973, 0.9975, 0.9978, 0.998, 0.9982, 0.9984, 0.9985, 0.9987, 0.9988, 0.9989, 1);
```

## Web Animations

```js
el.animate({ translate: ['0 0', '240px 0'] }, { duration: 705, easing: 'linear(0, 0.0061, 0.0227, 0.0474, 0.0783, 0.1137, 0.1523, 0.193, 0.2349, 0.2772, 0.3193, 0.3609, 0.4015, 0.4408, 0.4787, 0.5149, 0.5495, 0.5823, 0.6132, 0.6424, 0.6699, 0.6956, 0.7196, 0.742, 0.7629, 0.7823, 0.8003, 0.8169, 0.8323, 0.8466, 0.8597, 0.8718, 0.8829, 0.8931, 0.9025, 0.9111, 0.919, 0.9263, 0.9329, 0.939, 0.9445, 0.9495, 0.9542, 0.9584, 0.9622, 0.9657, 0.9689, 0.9718, 0.9744, 0.9768, 0.979, 0.981, 0.9828, 0.9844, 0.9859, 0.9873, 0.9885, 0.9896, 0.9906, 0.9915, 0.9923, 0.9931, 0.9937, 0.9943, 0.9949, 0.9954, 0.9958, 0.9963, 0.9966, 0.997, 0.9973, 0.9975, 0.9978, 0.998, 0.9982, 0.9984, 0.9985, 0.9987, 0.9988, 0.9989, 1)', fill: 'both' });
```

## In a vawe page

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

const k = 170, d = 26;

// 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: 705 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

config.default = { tension: 170, friction: 26 }. @react-spring/core 10.1.2, packages/core/src/constants.ts, const config (https://github.com/pmndrs/react-spring/blob/main/packages/core/src/constants.ts). Conversion: Stiffness is tension and damping is friction, with mass 1 (the default). The physics loop in the same package, acceleration = (-tension x displacement - friction x velocity) / mass, is the spring that spring() in springs.js solves.

## Related

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