Lerp

Linearly interpolate between two values

Linear interpolation — lerp — takes a normalized value (0 to 1) and maps it onto a target range. When the input t is 0, you get the start value. When t is 1, you get the end value. Values in between are proportionally placed along the range.

Lerp is the mathematical backbone of animation, transitions, and blending. Any time you see a smooth transition between two states — a color fade, a position tween, a volume crossfade — lerp is at work under the hood.

Together with normalize, lerp forms the foundation of remap. First normalize a value into the 0–1 range, then lerp it into a new range. This pair of operations is one of the most powerful tools in creative coding.

function lerp(start: number, end: number, t: number): number {
  return start + t * (end - start);
}

Patterns using Lerp