Universal Emotion

This gives you a systematic way to translate any emotional goal into concrete animation parameters using Disney's 12 principles. You define your target emotion across spectrums like energy and valence, then the framework maps those to specific timing values, easing curves, and deformation percentages. It includes quick reference tables for common emotions like joy, trust, and urgency, plus a decision tree for handling ambiguous cases. Most useful when you're moving beyond generic "smooth" or "snappy" animations and need to hit a specific emotional tone, whether that's building trust, conveying elegance, or creating playful brand moments. The CSS variable templates make it easy to codify your decisions.

Install to Claude Code

npx -y skills add dylantarre/animation-principles --skill universal-emotion --agent claude-code