Back to Plugins
Animate it - Motion Preset, Prototype and Code

Animate it - Motion Preset, Prototype and Code

Create animated smart components from presets quickly.

interactivesmart animatemotionanimationprototypeanimation presetscomponents

Plugin Preview

Animate it - Motion Preset, Prototype and Code preview

About this plugin

Animate any layer in one click. Animate It writes real keyframes onto Figma's Motion timeline, so you can keep editing them there.Pick, tweak, apply109 presets: entrances, exits, emphasis, loops, UI micro-interactions, paths that draw on, and text.Every preset previews live before you apply it. Picking one never touches your file; only Apply does.Each preset is a stack of clips (fade, fly, scale, spin, wiggle, blur, shadow, color, draw…). Change any value, drag the timing bars, add, hide, or remove clips.Values in px or %. Percent scales with the layer, so one preset looks right on an icon and on a hero card.Text that moves (Motion Presets)Split text by letters, words, or lines, with stagger orders: forward, reverse, center out, edges in, random.Pieces sit exactly where Figma drew them, so spacing and line breaks stay the same.Customize and Easy Select many layers and they play one after another. Add more motion and arrange timeline easy wayReady for code What you see easy to code.Open Code on any stack and copy it as CSS, as JSON for any platform, or as a prompt for your AI coding agent (Claude Code, Cursor, and others).Same times, values, and easing curves as your Figma timeline.Free37 presets (including text animations), 10 clip types, up to 3 clips per stack, and Component mode for prototype animations.Pro unlocks all 109 presets, every clip, split text on any stack, unlimited clips, and saving your own presets.--------Get Pro at animateit.proWorks with Figma's Motion timeline. Docs: animateit.pro/docsNeed helps @realvjy

Plugin Details

Version4
CreatedFebruary 10, 2025
Last UpdatedSeptember 25, 2026
CategoryPrototyping & animation plugins
Creatorvijay verma
Stats5706 installs, 753 likes
PricingFree

Technical Details

  • API:1.0.0
  • UI:dist/ui.html
  • main:dist/code.js
  • Document Access:dynamic-page
  • Network Access:

    Checks your Animate It Pro license key.

  • Editor Types:
    figma
  • Allowed Domains:
    • https://animateit.pro