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 customizationReset102 heroes · page 1 of 9

Sculpted Light Bust

A polished marble sculpture under studio lighting. The pointer orbits a single bright key light around the bust in real 3D, raking it across the stone face for hot specular highlights, cool subsurface shadows in the recesses, and a warm rim that tracks the cursor like a real museum spotlight.

Thermal Logo

Your logo rendered as a live thermal-camera image — a flowing heat field clipped to the silhouette and mapped through a cold-to-white-hot gradient, with the cursor leaving a glowing heat trail that slowly cools.

Glass Panels

Liquid-glass panels in WebGL — half-sphere bevel, biconvex refraction (entry + exit + thickness), edge-weighted blur mix, multi-light Blinn-Phong specular, Fresnel rim, drop shadow. Drop in any background image and it gets bent through the glass.

Floating Metrics City

Your KPIs become tall glowing 3D towers in a dark abstract city. The dashboard screenshot floats above the skyline like a control layer, with FogExp2 atmospheric perspective fading distant towers into deep blue-black.

Cinematic Before / After Slider

Two images or videos blended in 3D across a glowing, draggable glass divider. The split refracts the scene with a chromatic edge, the whole plane tilts on pointer parallax, and corner labels call out before and after — a transformation showcase for AI enhancement, photo and video editing, design tools, and beauty tech.

Auto Cover

Magazine-style cover that auto-cycles through a stack — large title, issue number, vertical spine text, with a pointer-driven tilt, a per-cover link, six entrance modes, and an optional pause-on-cover-hover.

Collection Carousel

Product cards float in a curved 3D carousel. The center card is large and sharp; cards rotating toward the sides shrink, dim and blur into depth. Auto-rotates slowly, drag to spin with momentum, click a side card to bring it to center.

Draggable Portfolio Cards

Portfolio cards float behind the headline and can be dragged with momentum, making the hero feel tactile and playful.

Old Internet Portal

A surreal 3D old-web desktop. Floating Windows 98 / classic Mac OS panels in CSS-3D, a pixel cursor trail, dotted retro wallpaper. Drag windows around by their title bars. Nostalgic browser chaos rendered as a premium composed tribute.

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.← PreviousPage 1 of 9CrazyGL · crazygl.comProgrammable hero sections for real websites.