Short Slide Down
Each new word drops in from above into its own line and pushes the stack downward until a centered multi-line composition locks in place.
Words
Installation
npx smoothui-cli add short-slide-downFeatures
- Word-by-word vertical build with top-entry and downward push
- Each word occupies its own centered line
- Layout-animated stacking as words are added
- Soft blur entry and bottom-exit per word
- Respects
prefers-reduced-motion - Announces updates via
aria-live="polite"
Accessibility
Reduced Motion
Respects the prefers-reduced-motion media query via useReducedMotion from Motion. When reduced motion is preferred, the full phrase appears at once and swaps instantly. The current phrase is announced via aria-live="polite".
Props
Shine Text
Animated React text with a metallic light sweep gliding across the letters on a loop, built with Motion and a clipped moving gradient.
Short Slide Right
The whole phrase glides in from the left as one compact move while words reveal in sequence through opacity — Keynote-style editorial restraint.