LogoClawIndex
CasesSkillsAbout
LogoClawIndex

anim - Design tasteful, accessible web UI animation

Guides the design and review of refined UI motion for interactions, transitions, loading states, and reveals using CSS, Web APIs, or React.

Tags

Updated: 2026-10-16
web animationUI motionCSS animationReact animationaccessibilityinteraction design

Capabilities

Define purposeful motionChoose animation timingApply easing curvesAnimate transforms and opacity

Typical Inputs

UI motion taskInterface codeAnimation context

Typical Outputs

Animation codeMotion review findingsReduced-motion behavior

What this skill does

  • Define purposeful motion
  • Choose animation timing
  • Apply easing curves
  • Animate transforms and opacity
  • Implement entrance and exit patterns
  • Respect reduced motion
  • Validate animation performance

Inputs

  • UI motion task
  • Interface code
  • Animation context
  • Accessibility requirements
  • Target device context

Outputs

  • Animation code
  • Motion review findings
  • Reduced-motion behavior
  • Timing and easing choices
  • Animation performance checks

Requirements

  • CSS, Web APIs, or React support
  • Reduced-motion preference support
  • Motion skill for motion/react API specifics

Source

  • Spec: SKILL.md
  • Spec: SKILL.md

ClawIndex

OpenClaw Skills & Use Case Index

ClawIndex is an ecosystem-driven index of OpenClaw skills and real-world use cases.

Index

Skills·
Cases

Meta

About·
Disclaimer·
Email·
GitHub
© 2026 ClawIndex All Rights Reserved.