animated-chart
Make a looping animated chart for LinkedIn or a newsletter in code with Claude Code. Bars that become a line, a number that…
Turn references you admire into a scene-by-scene Claude Motion prompt for your own topic and brand. Takes a video for the moves (screenshots, frames or a contact sheet of a reel or ad) and, optionally, a look reference for the style (a website, a brand, a moodboard). Use when
Claude Code
$ npx -y skills add charlie947/motion-graphics-skills --skill reference-to-motion --agent claude-code
Codex
$ npx skills add charlie947/motion-graphics-skills --skill reference-to-motion -a codex -y
Cursor
$ npx skills add charlie947/motion-graphics-skills --skill reference-to-motion -a cursor -y
Gemini CLI
$ npx skills add charlie947/motion-graphics-skills --skill reference-to-motion -a gemini-cli -y
GitHub Copilot
$ npx skills add charlie947/motion-graphics-skills --skill reference-to-motion -a github-copilot -y
OpenCode
$ npx skills add charlie947/motion-graphics-skills --skill reference-to-motion -a opencode -y
Windsurf
$ npx skills add charlie947/motion-graphics-skills --skill reference-to-motion -a windsurf -y
name: reference-to-motion description: Turn references you admire into a scene-by-scene Claude Motion prompt for your own topic and brand. Takes a video for the moves (screenshots, frames or a contact sheet of a reel or ad) and, optionally, a look reference for the style (a website, a brand, a moodboard). Use when someone says "make me something like this", "break down this reference", "use my website as the look" or "turn this into a Motion prompt". Outputs a short breakdown, then one paste-ready Motion prompt with timings for every scene.
You turn references into a Claude Motion prompt. A reference does one of two jobs:
One reference can do both if I say so. If I do not say, a video is a moves reference and anything still (a website, a moodboard) is a look reference. You never copy a video. My topic and my words build the film.
<task> 1. Look at everything I attach and sort it into moves and look. 2. Do not ask about views. If I mention them, you may say what they suggest (people watched to the end), never use them as a gate. 3. Break the moves reference down in five short lines:
4. If I gave a look reference, add a Look line: background, text and accent colours as hex codes, fonts (or the closest Google Fonts), and how it should feel and move. 5. Then ask me, in one batch: my topic, the exact words on screen, the length in seconds and the size (9:16, 1:1, 4:5 or 16:9). Ask for brand colours and font only if there is no look reference and no brief. Skip anything I already gave you. Wait for my answers. 6. Write the prompt. </task>
<rules>
</rules>
<output_format> Part 1: the five-line breakdown, plus the Look line if I gave a look reference. Part 2: one prompt in a code block, written to paste into a Claude Motion chat:
</output_format>
13 Claude Code skills for launch-grade motion graphics. Every frame is code. No After Effects, no video generator.
Make a looping animated chart for LinkedIn or a newsletter in code with Claude Code. Bars that become a line, a number that…
Rebuild an Apple-style Mac launch film entirely in code with Claude Code. A thin menu bar, the black notch growing into widgets…
The setup step every other skill in this pack reads. A short interview plus 3 to 5 reference frames becomes two files in your…
Make a 30-45 second product launch video in code with Claude Code, the kind SaaS companies post on launch day. One sentence split…
Turn a newsletter or blog cover into a seamless looping GIF at 896 x 640, 180 frames at 20fps. Only the one element you name…
Make a 12-second looping milestone clip in code with Claude Code. Thousands of tiny points drift like a night sky, pull together…
Overlay doctrine for captions in HyperFrames videos — the caption MODEL (drop / rail / embed) and the rule that captions are an…
AI music generation with ACE-Step 1.5 — background music, vocal tracks, covers, stem extraction for video production. Use when…
This skill should be used when a Seedance 2.0 prompt contains generic AI filler, hollow superlatives, vague cinematic language,…