A button becomes a player, a search box fills with results: one object changing shape.
Paste into Claude Code, Codex, Cursor or any agent that supports skills.
Needs: Node.js 22+, FFmpeg, Chrome. No API keys.
Other themes and formats
Theme: Paper · 9:16Theme: Electric · 1:1
Final frames from the same template, rendered with a different theme and format.
5 themes
Aa
Ink · default
Aa
Paper
Aa
Electric
Aa
Noir
Aa
Sand
Name a theme in your prompt, or set your own accent, background and text colors.
Install prompt
Read https://claude-motion.com/skills/ui-morph-effects/install.md and follow it to install the "ui-morph-effects" skill, then make a first video with it.
Paste into Claude Code, Codex, Cursor or any agent that supports skills.
Example prompt
Use the ui-morph-effects skill with the tabs effect for Ledger: tabs "Monthly | Yearly | Lifetime", second tab title "Yearly plan", rows "Every template: included | Commercial use: included | Updates: 12 months", 1:1, my accent #2563eb, no Example tag.
Style prompt (Claude Motion or Opus 5.5)
Make an 8-second 16:9 seamless loop for [who will watch, e.g. designers], playing [where, e.g. the hero of our product page]. Use only the query and three results below. Near-black background.
A small search pill with a magnifier and the gray word "Search" widens to full width, a caret appears and the query types itself. Three result cards rise into place one after another, each with a colored tile, a bold title and one metric. An orange hover outline moves from the first result to the second. End frame: at 6.6 seconds everything reverses, so the last frame matches the first.
Query: [e.g. "spring campaign"]
Three results: [title · metric] (e.g. "Spring launch email · 48% opens")
Nothing to install: paste this into Claude Motion (Team or Enterprise) or give it to Opus 5.5 for a similar look. The result changes from run to run; the skill gives the same result every time.
