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

Product Turntable Studio

A 3D product model rotates on a premium polished turntable disc beside the hero copy. Studio HDRI lighting, warm key and cool fill softboxes, drag to free-spin, and pointer hover-zoom — a high-end product launch in code.

Extruded Logo Monolith

Drop in a transparent SVG (or PNG) logo and it becomes a glossy black 3D sculpture with bevelled edges, studio HDRI reflections, a mirror floor, and an animated rim-light sweep. Premium product-shot look for SaaS, agencies, and AI tools.

Typographic Fluid Simulation

A bold headline acts as a mask for a real-time colorful fluid. Domain-warped FBM noise advected over time + a pointer-driven velocity grid swirl two color fields inside the type while the background stays minimal. Move the cursor to inject velocity and color into the letters.

Product in Elemental Scene

A 3D product floats inside a stylised elemental world chosen from its benefit — water, fire, ice, cloud, earth or light. A custom environmental shader and an instanced particle system surround the product and tint its lighting to match the element.

Paper and Shadow

Your product screenshot, printed on a softly curled sheet of paper resting under warm window light. Leaves drift overhead and cast slow, dappled shadows across the page.

Dashboard Eclipse

Your dashboard screenshot sits low in the frame, partially hidden behind a glowing eclipse horizon, a vertical beam of light rising from it like the product itself is powering the scene.

Glass Tile Logo

The logo is reconstructed from a grid of small glass blocks. Each tile floats apart, refracts the background through real MeshPhysicalMaterial transmission, then assembles into the silhouette on load. Hover separates the tiles slightly. Built with Three.js InstancedMesh + HDRI reflections + soft contact shadows.

Frosted CTA Panel

Your product screenshot drifts softly behind a frosted glass panel that holds the heading copy. Real transmission frost in the body, a sharp dispersive rim, two drifting light leaks, and layered parallax that separates the panel from the screenshot.

Product Pedestal

A 3D product model rests on a minimal floating pedestal under studio HDRI lighting. Slow turntable rotation, soft contact shadow, drifting dust, subtle mouse parallax, and press-and-drag to free-spin the product.

Artwork Lens

A clear glass DOME — a magnifying loupe / plano-convex lens — glides over a vibrant artwork with your heading composited on top. By default the artwork is an animated domain-warped colour field; supply your own image or video instead (cover-fit, never stretched). Beneath the lens everything is magnified UPRIGHT (not flipped like a glass marble), like a loupe sitting on the page: the centre magnifies cleanly, straight features curve more toward the rim, red/cyan chromatic fringing grows toward the edge, a Fresnel ring traces the rim and a specular hotspot sits upper-left. Because the heading is part of the scene, it reads normally outside the lens and is magnified, gently bent and chromatically split where the lens passes over it.

Typographic Black Hole

A headline warped by a glowing gravitational center. The cursor moves the singularity — letters bend, chromatic-aberrate, and pour toward the event horizon while a starfield lenses behind it.

Package Galaxy

An infinite 3D galaxy of npm package stars clustered by ecosystem, with glowing comets streaking through the field. Seamless on every axis, fog-baked depth, soft nebula clouds in the deep background.Page 7 of 14CrazyGL · crazygl.comProgrammable hero sections for real websites.