Skip to content

ablair264/animated-react-components

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

4 Commits
 
 
 
 
 
 

Repository files navigation

Animated React Components

Expert guidance for analyzing React components and implementing premium, production-grade animations using Motion, React Bits, Aceternity UI, and Magic UI.

What this skill does

  • Evaluates existing UI for high-impact motion opportunities
  • Commits to a single aesthetic direction and applies it consistently
  • Selects the right component library for the job
  • Ensures accessibility and performance best practices

Production quality

  • Uses shared motion tokens for consistent timing and easing
  • Enforces reduced-motion fallbacks and keyboard-safe interactions
  • Prioritizes transform/opacity and in-view gating for performance
  • Includes QA checks for reduced motion, layout stability, and smoothness

When to use

  • You want to enhance an existing React UI with motion
  • You need recommendations from React Bits, Aceternity UI, Magic UI, or Motion
  • You want a cohesive animation direction with production-quality implementation

What's included

  • SKILL.md: Core workflow and decision guidance
  • references/: Component catalogs, Motion patterns, and checklists

Installation

Place this folder in your Codex/Claude skills directory and restart the runtime, or use your skill installer to add the repo.

Notes

Runtime behavior is driven by SKILL.md. This README is for humans.

About

Claude skill providing expert guidance for premium React animations using Motion, React Bits, Magic UI, and Aceternity UI.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors