# Compose NoBouncy with StiffnessMediumLow: stiffness 400, damping 40 spring

> Compose NoBouncy with StiffnessMediumLow as a CSS linear() spring: stiffness 400, damping 40, settles in 0.465 s. Copy the CSS and the Web Animations line.

Canonical: https://vawe.dev/springs/compose-no-bouncy-medium-low
Last updated: 2026-11-04

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

The source comments that StiffnessMediumLow is the default stiffness of the springs in enter and exit transitions.

| Measure | Value |
| --- | --- |
| Stiffness | 400 |
| Damping | 40 |
| Mass | 1 |
| Damping ratio | 1 (about critically damped) |
| Settle time | 0.465 s |
| Overshoot | 0% |
| Crosses the end value | 0 |
| 50% of travel at | 0.084 s |
| 90% of travel at | 0.195 s |

## CSS linear()

```css
transition: translate 465ms linear(0, 0.0063, 0.0232, 0.0484, 0.0798, 0.1158, 0.1549, 0.1962, 0.2385, 0.2812, 0.3238, 0.3656, 0.4064, 0.4459, 0.4839, 0.5202, 0.5548, 0.5875, 0.6185, 0.6476, 0.6749, 0.7004, 0.7243, 0.7465, 0.7672, 0.7864, 0.8042, 0.8206, 0.8358, 0.8499, 0.8628, 0.8747, 0.8856, 0.8957, 0.9049, 0.9133, 0.9211, 0.9282, 0.9346, 0.9406, 0.946, 0.9509, 0.9554, 0.9595, 0.9633, 0.9667, 0.9698, 0.9726, 0.9752, 0.9775, 0.9796, 0.9816, 0.9833, 0.9849, 0.9863, 0.9876, 0.9888, 0.9899, 0.9909, 0.9917, 0.9925, 0.9933, 0.9939, 0.9945, 0.995, 0.9955, 0.996, 0.9964, 0.9967, 0.997, 0.9973, 0.9976, 0.9978, 0.998, 0.9982, 0.9984, 0.9986, 0.9987, 0.9988, 0.999, 1);
```

## Web Animations

```js
el.animate({ translate: ['0 0', '240px 0'] }, { duration: 465, easing: 'linear(0, 0.0063, 0.0232, 0.0484, 0.0798, 0.1158, 0.1549, 0.1962, 0.2385, 0.2812, 0.3238, 0.3656, 0.4064, 0.4459, 0.4839, 0.5202, 0.5548, 0.5875, 0.6185, 0.6476, 0.6749, 0.7004, 0.7243, 0.7465, 0.7672, 0.7864, 0.8042, 0.8206, 0.8358, 0.8499, 0.8628, 0.8747, 0.8856, 0.8957, 0.9049, 0.9133, 0.9211, 0.9282, 0.9346, 0.9406, 0.946, 0.9509, 0.9554, 0.9595, 0.9633, 0.9667, 0.9698, 0.9726, 0.9752, 0.9775, 0.9796, 0.9816, 0.9833, 0.9849, 0.9863, 0.9876, 0.9888, 0.9899, 0.9909, 0.9917, 0.9925, 0.9933, 0.9939, 0.9945, 0.995, 0.9955, 0.996, 0.9964, 0.9967, 0.997, 0.9973, 0.9976, 0.9978, 0.998, 0.9982, 0.9984, 0.9986, 0.9987, 0.9988, 0.999, 1)', fill: 'both' });
```

## In a vawe page

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

const k = 400, d = 40;

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

spring(dampingRatio = Spring.DampingRatioNoBouncy (1), stiffness = Spring.StiffnessMediumLow (400)). androidx main at 9adbcd8 (compose animation-core 1.14.0-alpha01), Spring.DampingRatioNoBouncy, Spring.StiffnessMediumLow (https://github.com/androidx/androidx/blob/androidx-main/compose/animation/animation-core/src/commonMain/kotlin/androidx/compose/animation/core/VectorizedAnimationSpec.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

- [react-spring stiff](https://vawe.dev/springs/react-spring-stiff)
- [Material 3 Expressive default spatial](https://vawe.dev/springs/material-expressive-default-spatial)
- [Material 3 Expressive slow spatial](https://vawe.dev/springs/material-expressive-slow-spatial)
- [vawe snappy](https://vawe.dev/springs/vawe-snappy)
- [All spring presets](https://vawe.dev/springs)