component
Text Shuffle
By Aviral Lakhanpaul
Details
- Aviral LakhanpaulAuthor
- componentType
- $5.00Price
- 2025-12-03Published
- 2026-01-18Updated
- 2025-11-28Added
- TextCategories
Summary
Drop the Text Shuffle component onto your canvas 2.
Description
Best suited for moments on your website where words need personality and impact. Features Character-level shuffle animation powered by Framer Motion Automatically selects a portion of characters per word for visual balance Multiple shuffle modes: Linear, Random, and Even/Odd Shuffle direction control: Left or Right Looping with configurable delay between loops Trigger on view (once or always) and on-hover retrigger Fully responsive and wrap-aware — ideal for long headings Customisation Options Text content and typography via Font control Shuffle direction, duration, stagger, and max delay Shuffle count (number of shuffles per character) Shuffle mode: Linear / Random / Even-Odd Colours for initial and final states Trigger settings: On View / On Hover / Looping / Loop Delay Set up 1. Drop the Text Shuffle component onto your canvas 2. Enter your headline or content in the Text field 3. Play with the properties, and you're done! After completing your purchase, you will receive a link to the component. Copy the URL and paste it into your Framer project to import it.
Introduction
Shuffling animated text effect
Rank history
Daily rank per list, from the first snapshot — lower is better.
- All · #6438