Stagger Letters
No library Beginner
On hover, each letter of the button label jumps upward with a spring-overshoot cubic-bezier transition, staggered by 38ms per character. All letters return to baseline on mouse leave.
On hover, each letter of the button label jumps upward with a spring-overshoot cubic-bezier transition, staggered by 38ms per character. All letters return to baseline on mouse leave.
Create a button where each letter jumps up with a cascading delay on hover. On hover: - Split the label into individual character spans - Apply translateY(-5px) to each span with a spring cubic-bezier transition - Stagger each character by 38ms (index * 38ms transition-delay) - Return to translateY(0) on mouse leave No library dependencies; pure CSS transitions + React state. Disable transitions under prefers-reduced-motion.
Paste into Claude, ChatGPT, or Cursor. Edit YOUR_STACK /
YOUR_STYLING / YOUR_CONSTRAINTS before sending.