motion-design — Skills — getagentictools

What it does

Creating UI animations (buttons, cards, modals, page transitions)

Designing micro-interactions and feedback animations

Building loading, success, or error states

Animating illustrations or decorative elements

Planning scroll-triggered or progress-based animations

Establishing brand motion identity

Choreographing multi-element sequences

Source

Repository: https://github.com/lottiefiles/motion-design-skill

motion-design FAQ

What does the motion-design skill do?

> Applies motion design principles to create emotionally-driven, technically sound animations and transitions. Provides timing, easing, choreography, and Disney animation principles adapted for UI. Use when creating animations, transitions, micro-interactions, loading states, page transitions, scroll-triggered effects, or any motion work. Works with CSS, Framer Motion, GSAP, Lottie, Spring, or any animation system. Creating UI animations (buttons, cards, modals, page transitions) Designing micro-interactions and feedback animations

How do I install motion-design?

Run: npx -y skills add https://github.com/lottiefiles/motion-design-skill --skill motion-design --agent claude-code — the source lives at github.com/lottiefiles/motion-design-skill.

Maintain motion-design?

Let people know it's listed here — add the badge (live metrics, light/dark aware) or a plain link to your README or docs.

[![motion-design on getagentictools](https://getagentictools.com/badge/skills/lottiefiles-motion-design-skill-motion-design.svg)](https://getagentictools.com/skills/lottiefiles-motion-design-skill-motion-design?ref=badge)

npx agentictools info skills/lottiefiles-motion-design-skill-motion-design

The second line is the CLI lookup for this page — handy in READMEs and docs.