Motion Ref Skill — AI skill for Claude Code
AI coding agent skill for UI motion design.
How to install Motion Ref Skill
This entry records only its repository, not the path inside it, so there is no
exact command to give. Open joepUI/motion-ref-skill and copy the folder into
~/.claude/skills/, or the file into ~/.claude/agents/.
What Motion Ref Skill does
AI coding agent skill for UI motion design. 111 production-ready effects across 13 categories — describe your product scenario, get CSS/JS code you can ship. Works with Claude Code, Codex, OpenClaw, and any SKILL.md-compatible agent.
Alternatives in AI
- Welcome — AI Research Skills — You now have access to 86 production-ready skills covering the entire AI research lifecycle: literature survey 5.4k ★
- Contributing To Claude Skills Library — Thank you for your interest in contributing to the Claude Skills Library 5.3k ★
- Vibe Coding Toolkit — A curated, battle-tested AI-coding toolkit: Claude Code plugins, subagent orchestration, quality gates, and re 297 ★
README
motion-ref-skill
Add motion to your product — no design background needed.
Install • Usage • Categories • Live Preview • 中文文档
AI agent skill for UI motion design. 119 production-ready effects across 13 categories — describe your product scenario, get implementation guidance you can ship. No motion design knowledge required.
Works with Claude Code, Codex, OpenClaw, and any SKILL.md-compatible agent.
Install
npx skills add https://github.com/joepUI/motion-ref-skillOr install manually:
git clone https://github.com/joepUI/motion-ref-skill.git ~/.claude/skills/motion-ref-skillRestart your agent after installing.
Usage
Describe your product scenario. The skill recommends the right animation and gives you production-ready code.
Enrich your whole site
/motion-ref My website feels static and lifeless.
Help me add animations to make it feel polished.The skill will analyze your pages and suggest a combination of effects: scroll reveals for content sections, stagger animations for card grids, hover feedback for buttons, smooth page transitions, etc.
Fix a specific problem
/motion-ref Users click the submit button and nothing happens for 3 seconds.
They keep clicking because there's no feedback./motiRelated Skills
Generate Image
Generate AI images for your Remotion project. Describe what you need — backgrounds, thumbnails, characters, ab
Forgecat Agent Profiles
Production-ready AI agent profiles for Claude Code, Cursor, Codex, OpenClaw, and Hermes. Search, install, and
Openclaw Setup Guide I Wish I Had
The complete OpenClaw setup & optimization guide from first install to production-ready AI agent in 11 steps.
Openclaw Cookbook
Production-ready recipes for OpenClaw — self-hosted multi-channel AI agent gateway. Telegram, Discord, Slack,
Answer Standing
Agent skill: measure how AI assistants (ChatGPT, Claude, Gemini, DeepSeek, Doubao...) describe your product wi
Consistent Web UI
Agent Skill that makes AI-built websites look like one consistent, professional product: one theme source, sha
Related Agents
Animation Engineer
Builds motion and animation — CSS transitions/keyframes, the Web Animations API, SVG animation, scroll-driven
Go Builder
Go+CUE implementation specialist for scenario-driven TDD. Consumes CUE scenarios, generates Go tests from them
Nosy Refuter
Tries to refute each item of a psst draft ("cheap, valuable work we can ship this week") against the product's
