Easing

Represents the easing function for a keyframe.

Easing type

Represents the easing function for a keyframe.

Signature:

type Easing =
  | {
      type: "LINEAR";
    }
  | {
      type: "CUBIC_BEZIER";
      x1: number;
      y1: number;
      x2: number;
      y2: number;
    };

Remarks

This controls how the animation interpolates into or out of this keyframe. Updating the easing values of a keyframe can make the animation feel smoother or more natural.

Example

// setting a cubic bezier easing on a keyframe at frame 10
const keyframe = layer.position.getKeyframeAt(10);

if (keyframe) {
  keyframe.easing = {
    type: "CUBIC_BEZIER",
    x1: 0.42,
    y1: 0,
    x2: 0.58,
    y2: 1,
  };
}
Last updated: August 5, 2026 at 11:47 AMEdit this page