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 customizationReset161 heroes · page 2 of 14

Floating Dust in Spotlight

A dim cinematic room with a hard-edged spotlight cone. Thousands of dust motes drift through the beam and twinkle as they cross the light.

Topographic Binary

A slowly-rotating 3D relief slab on a dark gradient: the ridge top is drawn as parallel contour lines and the outer face is a wall of falling glyphs — binary, ASCII, katakana or a custom word — that drip from under the lines, fan apart toward the bottom and glow. A depth-buffered occluder hides the interior so only the outer face shows. Framed by an editorial heading.

Chrome Y2K Wordmark

A huge mirror-chrome headline floating over a retro-future neon perspective grid. Star glints travel across the letters, gradient reflections shift with the pointer, and the whole thing reads as a Y2K poster you'd screenshot for your moodboard.

Liquid Metal Typography

Heavy 3D headline rendered as molten chrome — letters wobble with FBM noise while staying readable, pointer creates localized ripples on the surface, and clicking triggers a quick splash wavefront. Floats over an image or video backdrop with a user-selectable HDRI driving the reflections.

Floating Screen Recording

A product demo screenshot or video floats on a screen panel with an animated cursor, a glowing motion trail, expanding click ripples, and a zoom-lens magnifier that highlights UI moments.

Glass Typography

A headline cast in transparent optical glass: Three.js TextGeometry extruded into a real 3D object, rendered with MeshPhysicalMaterial (transmission, IOR, dispersion, clearcoat) so it visibly refracts the moving gradient behind it. Pointer parallax tilts the camera and CTA hover sweeps a bright edge highlight across the letters.

Morph Astronaut

A hover-focus hero: a bold display word is rendered as a true signed-distance field and softens or sharpens under the cursor via an SDF lens blur (no chromatic aberration), while an animated 3D character floats in front — playing its loop animation, tilting toward the pointer in 3D, and bobbing as if weightless. Drop in any animated .glb (e.g. an astronaut).

Torn Poster Hero

Layered torn posters build a premium campaign collage with depth, shadows, and a subtle peel-away motion.

Gravity Grid

Perspective-tilted wireframe plane warped by metallic spheres. The grid bends around each ball like a rubber sheet, and the cursor adds a fourth distortion well.

Screenshot as Hologram Projection

Your screenshot projected from a small device as a translucent holographic panel floating in the air. Wide cyan projection cone, moving scanlines, subtle flicker, drifting dust. Built for AI, dev tools, cybersecurity, and futuristic SaaS.

Dither Gradient

A dark editorial hero lit by a single grainy warm gradient that ramps along one animated sine contour (no mirrored band). The contour breathes with a pseudo-random amplitude, and the giant wordmark is rendered into the same shader so it is revealed by the light — bright where the gradient washes over it, sinking into near-black shadow elsewhere. Quantised, dithered and grained for a retro/print texture.

Progressive Blur Text

A giant display word that is razor-sharp at the top and melts into a progressively heavier blur toward the bottom — a true variable-radius blur per row, not a gradient-masked copy. Bold, editorial, fully recolourable.Page 2 of 14CrazyGL · crazygl.comProgrammable hero sections for real websites.