Getting it into your agent
One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.
npx agentmods add skills/jarvixgaby/motion-guide-skill/motion-guidenpx skills add JarvixGaby/motion-guide-skill --skill motion-guidegit clone --depth 1 https://github.com/JarvixGaby/motion-guide-skillWrote 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/jarvixgaby/motion-guide-skill/motion-guide)<a href="https://agentmods.dev/skills/jarvixgaby/motion-guide-skill/motion-guide"><img src="https://agentmods.dev/badge/skills/jarvixgaby/motion-guide-skill/motion-guide.svg" alt="Measured on agentmods" 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.00065 | $0.03127 |
| Opus 5 | $0.00032 | $0.01563 |
| Sonnet 5 | $0.00013 | $0.00625 |
| Haiku 4.5 | $0.00006 | $0.00313 |
Grade A, and why
motion-guide 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 6d 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 — 227 lines — stays where its author put it; the contents beside it link to each section on GitHub.
Motion Guide Advisor
Motion Guide is a default-trigger motion decision skill for AI coding agents. It helps the agent decide whether motion should exist, which Motion Guide pattern fits the product situation, and how to implement or review that motion without harming accessibility, performance, readability, or task completion.
It is not a component library or effect gallery. It may recommend no motion, a static layout change, clearer copy, or a lighter interaction state when motion would not improve the product.
When to Use
Use this skill whenever an agent is designing, adding, changing, suggesting, or reviewing UI that may include motion, even if the user did not explicitly say "animation".
Common triggers:
- loading states, progress, skeletons, spinners, or async status
- form submission, button feedback, success/error confirmation, or toast behavior
- route, modal, drawer, tab, card, or view transitions
- hover, focus, press, drag, swipe, or input feedback
- onboarding cues, coach marks, guided tours, or feature discovery
- chart/data reveals, counters, timelines, or knowledge/system visualization
- scroll progress, sticky navigation, parallax, reveal-on-scroll, or reading aids
- brand-forward landing pages, product showcases, storytelling, 2D/3D/WebGL/shader/particle hero motion
- code review of an existing UI diff that adds, removes, or changes motion
When website content changes, keep this skill plus references/motion-database.md and references/creative-motion-pack.md synchronized with the public Motion Guide decision set.
When Not to Use
Do not add or intensify motion when it lacks a clear product function. Prefer static hierarchy, spacing, contrast, clearer copy, or instant state changes for:
- checkout, payment, destructive, legal, security, medical, financial, trading, or operational-critical flows
- dense dashboards, admin tables, settings, logs, or frequent repetitive workflows
- precision tools where elasticity, bounce, delay, or theatrical motion implies imprecision
- fake or unmeasurable progress; never show a determinate percentage without real progress data
- long text pages where parallax, scroll hijacking, or repeated reveals reduce reading clarity
- large/filterable lists where staggered animations replay across many items
- any interaction where motion delays access to primary content or hides critical information
What ships with it
4 files 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.
- 6d ago First seen · 227 lines · 65 tokens per session scan A 662e18836361
motion-guide is a skill published in the GitHub repository JarvixGaby/motion-guide-skill (8 stars, last pushed 1mo ago), licensed MIT. It adds 65 tokens to every session and 3,127 once invoked, about $0.0003 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
modern-site-engineering
Implement beautiful modern websites and web apps with an opinionated premium frontend stack. Use for Next.js, React, Tailwind, Motion, GSAP, Lenis, Three.js/React Three Fiber, shadcn/ui customization, responsive layouts, landing pages, portfolios, cinematic sites, luxury brand sites, Squarespace-like sites, and any…
web-design-direction-system
Use for premium frontend, website, app UI, landing page, dashboard, redesign, image-to-code, or visual-polish work that needs clearer design intent, adjustable visual direction, motion discipline, less generic output, and a final preflight check before handoff.
web-imagegen-prompting
Prompt generated imagery for premium websites. Use when Codex needs hero images, product scenes, editorial visuals, backgrounds, portraits, venue imagery, campaign art, texture assets, mockups, or image-generation direction for luxury, cinematic, Squarespace-polished, Viktor Oddy-adjacent, or non-generic site visuals.
tailwind-design-tokens
Create token-driven Tailwind and CSS variable systems for premium websites. Use for color tokens, typography tokens, spacing rhythm, radius, shadows, gradients, surfaces, responsive constraints, dark/light modes, and avoiding random utility-class styling.
ui-primitives-shadcn-lucide
Use shadcn/ui, Radix-style primitives, and lucide-react icons without producing generic default UI. Use for dialogs, menus, accordions, tabs, forms, buttons, toolbars, icons, inputs, and app controls that need accessibility and polished custom styling.
visual-regression-lab
Use after frontend changes or before delivery to run rendered visual QA with Playwright/browser screenshots, viewport checks, console/network checks, overflow detection, canvas/media verification, before/after comparisons, and responsive polish review.