Add purposeful frontend animations and micro-interactions that improve feedback, transitions, hierarchy, and delight while respecting performance and prefers-reduced-motion.
Scanned 9/8/2026
Install to Claude Code
npx -y skills add agisota/old-one --skill animate --agent claude-codeInstalls into .claude/skills of the current project.
Are you the author of Animate?
Add the live security badge to your README — it updates automatically with every re-scan.
[](https://www.skillsdirectory.com/skills/agisota-animate)More formats (shields.io, HTML) on the badges page.
---
name: animate
description: Add purposeful frontend animations and micro-interactions that improve feedback, transitions, hierarchy, and delight while respecting performance and prefers-reduced-motion.
---
# Animate
This is the Impeccable animate mode alias.
Use the installed `impeccable` skill as the design context first, then focus only
on motion that improves usability or feel.
## Workflow
1. Identify where motion would clarify feedback, smooth a transition, explain
hierarchy, or add a high-value delight moment.
2. Pick one coherent motion strategy before adding individual effects.
3. Implement with transform and opacity where possible. Avoid animating layout
properties such as width, height, top, and left.
4. Respect `prefers-reduced-motion` and keep interaction feedback fast.
5. Verify motion is smooth, purposeful, non-blocking, and not exhausting.
Source: https://skills.sh/pbakaus/impeccable/animate
Is this your skill, or is something wrong with this listing? Request removal or report an issue. Author removals are honored within 72 hours.
No comments yet. Be the first to comment!