Getting it into your agent
It runs from inside its repository, so the clone comes first — what it calls does not travel with the file alone.
git clone --depth 1 https://github.com/ChanMeng666/svg-animation-studionpx agentmods add skills/chanmeng666/svg-animation-studio/svg-animateWrote this? Show the measurements
A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.
[](https://agentmods.dev/skills/chanmeng666/svg-animation-studio/svg-animate)<a href="https://agentmods.dev/skills/chanmeng666/svg-animation-studio/svg-animate"><img src="https://agentmods.dev/badge/skills/chanmeng666/svg-animation-studio/svg-animate/github.svg" alt="Measured on agentmods" height="20"></a>Or the 80×15 button, for a site that already has a row of RSS and ATOM ones. Only the verdict fits; the numbers stay here.
<a href="https://agentmods.dev/skills/chanmeng666/svg-animation-studio/svg-animate"><img src="https://agentmods.dev/badge/skills/chanmeng666/svg-animation-studio/svg-animate.svg" alt="Reviewed on agentmods" width="80" height="20"></a>What it costs to keep this loaded
Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.
| Model | Per session | Once invoked |
|---|---|---|
| Fable 5.1 | $0.00222 | $0.02190 |
| Opus 5 | $0.00111 | $0.01095 |
| Sonnet 5 | $0.00044 | $0.00438 |
| Haiku 4.5 | $0.00022 | $0.00219 |
Grade A, and why
svg-animate scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 11d ago.
A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.
Nothing flagged
None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.
How it starts
The opening of the file, as written. The whole thing — 204 lines — stays where its author put it; the contents beside it link to each section on GitHub.
You are the entry point for SVG animation requests in this repository.
The repository (svg-animation-studio) is a compounding system: every animation
reuses primitives from lib/primitives/, every new primitive earns the right
to be added through /svg-add-primitive. Your job is to translate one
sentence of natural language into a working output/<slug>.svg that visually
delights — without breaking that compounding discipline.
Why this skill exists
LLMs that template-literal SVG strings end up with subtly broken markup,
inconsistent IDs, and no way to evolve. This skill funnels everything through
lib/composer.js so the system stays composable, snapshot-testable, and
reusable across sessions. If you find yourself wanting to write <svg ...>
inline anywhere, stop — composer.composeSVG exists for exactly that need.
Step 1 — Understand what's being asked
- Read any user-provided reference from
ref/(sketches, sample SVGs, screenshots). - Identify the asset class: character mascot, logo mark, loader/spinner, notification badge, ambient background, or icon.
- Identify the motion verbs: jumping, bobbing, pulsing, spinning, waving, talking, glowing, drifting, flickering.
- Identify the style cues: pixel-art, gradient-smooth, flat, neon, comic.
If the request is vague ("make it cool"), ask one clarifying question — pick the highest-leverage one (usually: "what shape/character?" or "what motion?"). Don't grill the user.
Step 2 — Read the catalog before composing
Open lib/presets/index.js to see what already exists. Look at each
candidate's compose() (~30 lines each) to learn the patterns. Decide one of:
- Fork — closest existing preset is 80%+ right. Copy its file to a new slug, adjust params/colors.
- Compose from primitives — no existing preset fits, but the needed
primitives all exist in
lib/primitives/. Build a new preset. - Stop and request a primitive — a needed motion / shape / filter doesn't
exist. Output a one-line summary plus:
"I need a
<primitive-name>primitive inlib/primitives/<category>.js. Please run/svg-add-primitive <name>." Do NOT add primitives inline. Seedocs/extension-protocol.mdrule 1.
What ships with it
1 file beside SKILL.md in the same directory: the scripts, references and assets a skill reads on demand. Not counted in the per-session cost; read them before you install if any of them is executable.
What this file has done since we first saw it
Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.
- 11d ago First seen · 204 lines · 222 tokens per session scan A 3e68d2bf724a
svg-animate is a skill published in the GitHub repository ChanMeng666/svg-animation-studio (2 stars, last pushed 2mo ago), licensed MIT. It adds 222 tokens to every session and 2,190 once invoked, about $0.0011 per session on Opus 5. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-31.
Other skills, from other repositories
logo-design
Generate logo variants for a brand, producing multiple production-grade marks across different architectures (wordmark, lockup, symbol-only, letterform-as-symbol, monogram) with rationale, application specs, and decision-ready presentation. Distinct from brand-identity, which produces the complete system (logo plus…
art-direction
Direct visual and creative work for campaigns, photography, illustration, video, and branded experiences. Use this skill whenever the user wants to brief a photographer, direct illustrators, plan a creative campaign, develop visual concepts, or evaluate creative work for fit. Triggers on art direction, photo brief…
creative-brief-selector
Produce a creative brief grounded in live reference sites and deliberately distinct from existing demos, for any new brand build. Composes with brand-archetype-system and creative-direction. Use this skill at the start of any brand or microsite build when the result needs to land in a specific aesthetic position and…
creative-direction
Walk the user through four directional axes (tone register, aesthetic philosophy, audience relationship, sensory ambition) and produce a structured aesthetic brief that downstream content, copy, design, and art-direction skills consume as required input. The aesthetic depth layer, distinct from creative-brief…
presentation-design-enhancer
Transform text-heavy slides into visual storytelling. Suggest layout improvements, icon usage, and data visualization.
stock-photo-finder
Search multiple free stock photo sites simultaneously. Filter by license type, orientation, and color scheme.