# Material 3 Expressive fast spatial: stiffness 800, damping 33.94 spring

> Material 3 Expressive fast spatial as a CSS linear() spring: stiffness 800, damping 33.94, settles in 0.36 s. Copy the CSS and the Web Animations line.

Canonical: https://vawe.dev/springs/material-expressive-fast-spatial
Last updated: 2026-11-04

Stiffness 800, damping 33.94 and mass 1 give a damping ratio of 0.6, so the spring is underdamped. It settles to within 0.1% in 0.36 s. It passes the end value by up to 9.5% at 0.139 s and crosses it 2 times.

It is the bounciest of the four Material 3 spatial springs here.

| Measure | Value |
| --- | --- |
| Stiffness | 800 |
| Damping | 33.94 |
| Mass | 1 |
| Damping ratio | 0.6 (underdamped) |
| Settle time | 0.36 s |
| Overshoot | 9.5% |
| Crosses the end value | 2 |
| 50% of travel at | 0.049 s |
| 90% of travel at | 0.084 s |

## CSS linear()

```css
transition: translate 360ms linear(0, 0.0077, 0.0292, 0.0622, 0.1046, 0.1544, 0.2099, 0.2694, 0.3314, 0.3946, 0.458, 0.5205, 0.5814, 0.6399, 0.6956, 0.7479, 0.7966, 0.8414, 0.8823, 0.9192, 0.952, 0.9809, 1.006, 1.0275, 1.0455, 1.0603, 1.072, 1.0811, 1.0876, 1.0919, 1.0942, 1.0948, 1.0938, 1.0916, 1.0884, 1.0842, 1.0794, 1.0741, 1.0684, 1.0625, 1.0565, 1.0505, 1.0446, 1.0388, 1.0333, 1.0281, 1.0232, 1.0186, 1.0144, 1.0106, 1.0072, 1.0041, 1.0014, 0.9991, 0.9971, 0.9955, 0.9941, 0.993, 0.9922, 0.9916, 0.9912, 0.9911, 0.991, 0.9911, 0.9914, 0.9917, 0.9921, 0.9925, 0.9931, 0.9936, 0.9942, 0.9947, 0.9953, 0.9959, 0.9964, 0.9969, 0.9974, 0.9979, 0.9983, 0.9987, 1);
```

## Web Animations

```js
el.animate({ translate: ['0 0', '240px 0'] }, { duration: 360, easing: 'linear(0, 0.0077, 0.0292, 0.0622, 0.1046, 0.1544, 0.2099, 0.2694, 0.3314, 0.3946, 0.458, 0.5205, 0.5814, 0.6399, 0.6956, 0.7479, 0.7966, 0.8414, 0.8823, 0.9192, 0.952, 0.9809, 1.006, 1.0275, 1.0455, 1.0603, 1.072, 1.0811, 1.0876, 1.0919, 1.0942, 1.0948, 1.0938, 1.0916, 1.0884, 1.0842, 1.0794, 1.0741, 1.0684, 1.0625, 1.0565, 1.0505, 1.0446, 1.0388, 1.0333, 1.0281, 1.0232, 1.0186, 1.0144, 1.0106, 1.0072, 1.0041, 1.0014, 0.9991, 0.9971, 0.9955, 0.9941, 0.993, 0.9922, 0.9916, 0.9912, 0.9911, 0.991, 0.9911, 0.9914, 0.9917, 0.9921, 0.9925, 0.9931, 0.9936, 0.9942, 0.9947, 0.9953, 0.9959, 0.9964, 0.9969, 0.9974, 0.9979, 0.9983, 0.9987, 1)', fill: 'both' });
```

## In a vawe page

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

const k = 800, d = 33.94;

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

damping ratio 0.6, stiffness 800 (MotionScheme.expressive().fastSpatialSpec()). androidx main at 9adbcd8 (compose material3 1.6.0-alpha01), ExpressiveMotionTokens.SpringFastSpatialDamping (0.6) and SpringFastSpatialStiffness (800) (https://github.com/androidx/androidx/blob/androidx-main/compose/material3/material3/src/commonMain/kotlin/androidx/compose/material3/tokens/ExpressiveMotionTokens.kt). Conversion: Stiffness is used as it is with mass 1 (SpringSimulation takes the natural frequency as sqrt(stiffness)). damping = 2 x dampingRatio x sqrt(stiffness), the same c = 2 x naturalFreq x dampingRatio that SpringSimulation.getAcceleration uses.

## Related

- [Motion x, y and rotate default](https://vawe.dev/springs/motion-transform)
- [Compose spring() default](https://vawe.dev/springs/compose-no-bouncy-medium)
- [Motion scale default](https://vawe.dev/springs/motion-scale)
- [Material 3 Standard default spatial](https://vawe.dev/springs/material-standard-default-spatial)
- [All spring presets](https://vawe.dev/springs)
