component
Word Shifter
By Sanna Granqvist
Details
- Sanna GranqvistAuthor
- componentType
- $12.00Price
- 2026-02-23Published
- 2026-02-23Updated
- 2026-02-15Added
- TextCategories
Summary
Rotating words with adaptive highlight
Description
Create a sentence like “Build bold text components.” and let the middle word rotate through your own list. You control three parts: textBefore words textAfter The component handles the animation and keeps the layout steady while the word changes. Highlight styles Choose how the rotating word is presented: Pill – Rounded background behind the word Solid – Changes the word color None – Pure rotation, no extra styling The pill background can resize automatically to match each word, or stay fixed if you prefer a locked width. Animation controls Auto-rotates every 2.5 seconds Smooth slide-up entrance and exit Adjustable in and out durations Respects prefers-reduced-motion Layout controls Fine-tune vertical offset Adjust gap spacing Left, center, or right alignment Best used for Hero sections SaaS landing pages Feature intros Refund policy All sales are final. No refunds are offered after purchase.
Introduction
Rotating words with adaptive highlight
Rank history
Daily rank per list, from the first snapshot — lower is better.
- All · #1763