CrazyGLCrazyGLHomeExploreGitHubBrowse heroes
The gallery

Every hero.
One catalogue.

Search by name, tag, or capability. Each hero is installable as a standalone NPM package.

★ FeaturedWebGLCanvas3DImage supportInteractiveFont customizationReset275 heroes · page 20 of 23

Shine Text

Premium chrome-style shine — silver gradient face, soft wide highlight with iridescent tint leading the sweep, and a pulsing glow halo that breathes in sync.

Scroll Text Fade

A long block of copy that fades word-by-word as the visitor scrolls — early words go dim, current words pop, future words sit faded.

Rotating Text Pro

Slot machine with a 3D flip in X — the rotating word flips over a horizontal axis like a split-flap board.

Motion Colour Text

Heading filled with a constantly drifting multi-stop conic gradient — like aurora moving through the letterforms.

Hover Text Reveal

A row of phrases where hovering one expands a stagger-typed paragraph beside it — the kind of FAQ heading-list interaction premium SaaS sites use.

Card Expand Reveal

Horizontal accordion of cards — the active card stretches to reveal an inner story, others compress to vertical labels. Auto-cycles on idle.

3D Depth Text

Heading extruded with stacked text-shadow layers — a faux-3D effect with a slow camera-style tilt that follows the cursor.

Scroll Text Color

A heading whose colour sweeps from start to end as the user scrolls — uses background-clip:text for crisp gradient handover.

Text Swap Animation

Phrases swap with a clean two-layer flip — old rises and fades, new rises in from below. The cleanest possible rotator.

Scroll Text FX

Each letter scales, rotates and brightens as it passes the scroll midpoint — an editorial mid-line emphasis effect.

Rotating Headline

A static two-line headline with one slot that rotates through a list of words — the prefix and suffix stay put, the rotating word cycles.

Pro Text Type Effect

A pro-grade typewriter: cycles through multiple strings with variable per-character speed, fluid font sizing (clamp), per-line gradient fills, and a choice of cursor characters from block to slug to bar.Page 20 of 23CrazyGL · crazygl.comProgrammable hero sections for real websites.