anime_keyframes: Specify per-property keyframes for an animation

In animejs: R Bindings to the 'Anime.js' Animation Library

Specify per-property keyframes for an animation

Description

Constructs a keyframes object for use in the props argument of anime_add() or anime_animate(). Each positional argument is one keyframe.

Usage

anime_keyframes(...)

Arguments

...	<dynamic-dots> Keyframe values. Either bare atomic values, or lists each with a ⁠$to⁠ key and optional ⁠$ease⁠, ⁠$duration⁠, and ⁠$delay⁠ overrides. ⁠$ease⁠ accepts an anime_easing object or an Anime.js easing name string.

Value

An anime_keyframes object.

Examples

# Bare numeric keyframe values
anime_add(
  anime_timeline(),
  selector = ".circle",
  props = list(
    opacity = anime_keyframes(0, 1, 0.5),
    translateY = anime_keyframes(-20, 0, 10)
  )
)

# Per-keyframe lists with optional ease and duration overrides
anime_add(
  anime_timeline(),
  selector = ".circle",
  props = list(
    opacity = anime_keyframes(
      list(to = 0),
      list(to = 1, ease = anime_easing("Cubic"), duration = 400),
      list(to = 0.5, ease = "linear", duration = 200)
    )
  )
)

animejs documentation built on Aug. 21, 2026, 5:17 p.m.