Hover

Hover effects (lift, scale, glow) from plain Tailwind utilities, no custom CSS.

How it works
  • Compose a transition with hover variants: hover:-translate-y-1 for lift, hover:scale-105 for scale, a hover shadow for glow
  • These are plain Tailwind utilities, so there is no class to ship. Use them directly on any element
Accessibility
  • Hover effects are decorative and never the only way to perceive state. Keep focus-visible styles for keyboard users
  • Touch devices have no hover, so treat these as enhancements and keep the base state usable on tap
  • The transitions collapse under prefers-reduced-motion to an instant change