Shatter & Rewind text animation: the word aimotions animated in this style
107KineticCanvas

Shatter & Rewind

A shatter and rewind text effect: a chrome word cracks, bursts into spinning 3D glass shards in slow motion, then rewinds as every piece flies back into place. Big impact for trailers, game titles and launch teasers.

Prompt · replace [TEXT]

Tool-agnostic
Shatter [TEXT] like glass and rewind it. Set the word huge in a heavy, wide all-caps display face with a chrome finish (bright top, dark horizon line through the middle, bright bottom) on a deep teal-black background. A sheen glides across it. Then an impact hits one letter: a radial spiderweb crack races across the word, and it bursts into triangular shards that fly toward the camera, tumbling in 3D with perspective, lit faces flashing pale and backs going dark, glass dust drifting, slowing almost to a stop. Then everything rewinds: the shards accelerate back along their paths and snap together, the cracks heal and a thin shock ring ripples out. A small mono readout switches between PLAY and REWIND, its timecode running backwards. Loop.

Visual DNA

  • Chrome lettering with a horizon-line reflection and a passing sheen
  • Radial spiderweb crack from a single impact point
  • Around 150 triangular shards tumbling in 3D with perspective and lighting
  • Burst that slows to a float, then an accelerating rewind snap
  • Play and rewind readout with a timecode that runs backwards
Category
Kinetic Typography
Demo built with
Canvas
Energy
Intense
Background
Dark bg

Also known as

Support
Keep aimotions free

No paywall, no sign-up. If a prompt saved you an hour, a coffee keeps new styles coming.

Buy me a coffee

Keys: ← → browse · C copy

Use this style

  1. Step 01Copy the prompt

    It describes the Shatter & Rewind look (composition, type, palette, texture and timing) without tying you to a tool.

  2. Step 02Replace [TEXT]

    Swap in your word, product name or headline. Short words (4–12 letters) read best in most styles.

  3. Step 03Ask for a format

    Paste it into Claude Opus 5.5, Claude Sonnet 5.5, Claude Fable 5.5, GPT-6 Astra or GPT-6.1 Sol, or a newer model, and request a single HTML file, a component, a shader or a brief. For a hero heading, use “Copy for website title”.

Website titles →Prompt guide →

109KineticCSS

Slice & Split

sliced text animation · split text effect · text slice transition · horizontal band split

Details →
111KineticCSS

Stomp Cut Edit

stomp text animation · fast cut typography · beat synced text · punchy promo titles

Details →

Keep it free.

aimotions has no paywall and no sign-up. It is funded by people who found a style they love. A coffee on Ko-fi helps pay for hosting and the next batch of styles.

Support on Ko-fi ♥