Motion Studio

Classes in · production code out

Reviewed recipes

Registry contract

Every recipe declares adapters, accessibility guidance, source, version, and maintainer.

live viewport · 900px

Timeline300ms

Motionwind classes

Element

Content

✓ syntax valid

Duration300ms

Stiffness420

Damping24

Export target

Production outputreact

<motion.button
  data-motionwind-motion=""
  className="rounded-xl bg-acid px-6 py-3 font-semibold text-black"
  whileHover={{ scale: 1.05 }}
  whileTap={{ scale: 0.95 }}
  transition={{ type: "spring", stiffness: 420, damping: 24 }}
>  Ship the interaction
</motion.button>