Easing

An easing function maps a normalised time t in [0, 1] to an eased output, also typically in [0, 1], that you use to animate properties non-linearly. The standard naming convention from Robert Penner’s classic library is preserved here: in_* curves accelerate from rest, out_* curves decelerate to rest, and in_out_* curves do both — easing in for the first half of the duration and easing out for the second.

Every entry below is a single pure WGSL function in the registry. Pull one into a composition by slug, then call it from any stage:

let main = r#"
@fragment fn fs_main(in: VertexOutput) -> @location(0) vec4<f32> {
    let t = in.uv.x;
    let y = out_cubic(t);
    return vec4<f32>(vec3<f32>(y), 1.0);
}
"#;
let shader = Shader::new(&["easing/out_cubic", main])?;

Each preview below plots y = ease(uv.x) as a soft accent line over a dark grid; warm tones mark in_*, cool tones mark out_*, and neutral tones mark in_out_*. The vertical axis is y = 0 at the bottom and y = 1 at the top; curves that overshoot or undershoot (in_back, out_back, out_elastic) leave the unit box deliberately.

in_back

Cubic curve with overshoot before the start, using the classic Robert Penner constants.

fn in_back(t: f32) -> f32

in_cubic

t^3 — slow start, steep finish.

fn in_cubic(t: f32) -> f32

in_expo

2^(10*(t - 1)) with an exact 0 at t = 0.

fn in_expo(t: f32) -> f32

in_out_cubic

Cubic curve mirrored about t = 0.5: 4 t^3 for t < 0.5, the matching reflection for t >= 0.5.

fn in_out_cubic(t: f32) -> f32

in_out_expo

Symmetric exponential ease that snaps to exact 0 and 1 at the endpoints to avoid the residual offset of pure 2^x.

fn in_out_expo(t: f32) -> f32

in_out_quad

Quadratic curve mirrored about t = 0.5: 2 t^2 for t < 0.5, the matching reflection for t >= 0.5.

fn in_out_quad(t: f32) -> f32

in_out_quart

Quartic curve mirrored about t = 0.5: sharper S-shape than in_out_cubic.

fn in_out_quart(t: f32) -> f32

in_out_sine

-(cos(pi t) - 1) / 2 — the smoothest of the standard S-curves.

fn in_out_sine(t: f32) -> f32

in_quad

t^2 — gentle slow start.

fn in_quad(t: f32) -> f32

in_quart

t^4 — much slower start than in_quad, holds near zero longer.

fn in_quart(t: f32) -> f32

in_sine

1 - cos(t * pi/2) — quarter-sine ramp in.

fn in_sine(t: f32) -> f32

linear

Identity curve. The reference baseline for every other entry on this page.

fn linear(t: f32) -> f32

out_back

Overshoots past 1 near the end, then settles. Classic Robert Penner constants.

fn out_back(t: f32) -> f32

out_bounce

Three-step Penner bounce-out: the value lands on 1 after three diminishing rebounds.

fn out_bounce(t: f32) -> f32

out_cubic

1 - (1 - t)^3 — fast start, smooth landing.

fn out_cubic(t: f32) -> f32

out_elastic

Damped sinusoidal oscillation that settles to 1. The curve briefly exceeds 1 and dips below it before damping out.

fn out_elastic(t: f32) -> f32

out_expo

1 - 2^(-10 t) with an exact 1 at t = 1.

fn out_expo(t: f32) -> f32

out_quad

1 - (1 - t)^2 — gentle landing.

fn out_quad(t: f32) -> f32

out_quart

1 - (1 - t)^4 — sharper deceleration than out_quad, very gentle final approach.

fn out_quart(t: f32) -> f32

out_sine

sin(t * pi/2) — quarter-sine ramp out.

fn out_sine(t: f32) -> f32