Animate Motion, Morph & Micro-interactions

Animate gives you 332 hand-tuned motion presets and turns them into real Figma output — Component variant chains, Motion keyframe tracks, or a timed vector Morph. What you see playing in the panel is exactly what lands on your canvas: same easing, same duration, same result.

Three engines, one library• Component — builds a variant set and wires the prototype reactions, so the animation works in any prototype without a runtime.• Motion — writes manual keyframe tracks onto the layer: transform, opacity, corner radius, stroke weight, size, auto-layout spacing, grid gaps and effect radius.• Morph — turns two vectors into a timed, editable flipbook of frames, with the easing baked into the frame positions.

Pick a preset once. Switch engines without redoing the work.

Tune it, don't fight itAmount and Speed rescale every value in the preset, including opacity and blur. On top of that you get trigger (hover / click / always), repeat, start delay, gap between rounds, total duration, and a per-step duration and curve. A custom cubic-bezier editor is built in, and a linear ghost plays alongside your animation so you can see what the easing is actually doing.

Line drawing that finishes properlyMorph ships 13 line-draw modes — draw, reverse draw, from the middle, erase, reverse erase, draw-and-erase, draw · hold · erase, shrink to centre, pulse, one-by-one, delayed, reverse stack and alternate. Each one is sampled into the frames, so the icon ends up in a clean resting state instead of freezing mid-stroke.

Bring animation in, take code outPaste a CSS @keyframes block, an animation: line, a cubic-bezier() or a linear() spring you found on the web and Animate parses it into an editable preset. Properties Figma cannot express are reported instead of silently dropped. Export the other way as CSS or SVG when you need to hand a spec to a developer.

Honest about what it does• Runs fully offline. No network requests, no accounts, no telemetry. The manifest declares allowedDomains: ["none"] and every style, script and icon is inlined.• Reversible. Apply and revert are paired. Reverting removes what the plugin wrote and leaves your own effects and keyframe tracks alone.• Loud when it fails. If a layer refuses an effect or a keyframe track, you get a notification and a count — not a silent no-op.• Bilingual. Full Turkish and English interface, light and dark theme.

Known Figma limitsThese are platform limits, not bugs, and the plugin tells you when you hit one:• The Motion public API has no skew / shear track, so skew-based presets are flagged as partial or unsupported for that engine.• Motion playback mode cannot be set from a plugin, so loops are baked as a fixed number of keyframe rounds (1–20, default 3).• Smart Animate does not interpolate real path geometry, which is why Morph produces a frame chain instead of a single transition.• ON_CLICK reactions have no delay field in Figma, so start delay applies to hover and always triggers only.• Manual keyframes can be refused on some node types and on children inside an instance.

Getting startedSelect one or more layers on the canvas.

Open Animate and pick a preset from the library.

Set the trigger, Amount and Speed. Watch the preview.

Choose Component, Motion or Morph and click Apply.

Not what you wanted? Revert and try another engine.