Text Shuffle — Shuffling animated text effect

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.