LIGHT. MATH. YOUR NEXT BUILD.

Interactive WebGL shader backgrounds

Browse 89 animated backgrounds for website heroes, feature panels, cards and calls to action. Choose from gradients and light sheets, particles, glass, liquid metal, ink, grids, wireframes and organic motion. Each shader reference includes presets, supported controls and a JavaScript integration example.

Start with Prism for a soft gradient hero, Kinetic for a mouse-reactive dot grid, or Spectral Glass for colored glass panels. The React, JavaScript and Next.js guides cover integration, sizing, reduced motion and cleanup.

All shader references

• ASCII Plasma: Procedural terminal glyphs reveal a drifting plasma field. Your cursor stirs the characters into a glowing eddy with a delayed wake.
• Atlas: Organic ridges and valleys drift across a layered terrain map. Fine contours gather around the elevation beneath your pointer.
• Aureole: A translucent loop folds and breathes through fine luminous filaments. Iridescent surfaces shift color while glowing edges trace its depth; your cursor gently deforms the membrane.
• Aurora: Luminous curtains lift around your cursor and brighten in its wake, drifting back into a quiet night sky.
• Bitwave: Discrete luminous ribbons travel across a dark pixel field. The cursor bends their wave crests and leaves a spring-soft directional wake.
• Blocky: A precise grid steps from a soft page tone into saturated color. The pointer lifts nearby tiles while rare accent cells breathe through the flow.
• Bloom: Suspended pigment swirls gently around your cursor and drags into a slow, diffusing wake.
• Caustics: Refracted pool light responds to mouse strokes with fading ripples, local refraction, and brighter moving edges.
• Chrome: Liquid-metal reflections bend beneath your cursor, leaving a thin specular sheen as their folds settle.
• Comet: Three luminous comets zip through curved paths, accelerating into bright streaks. Choose an organic, infinity, circle, or orbit path; your cursor disperses nearby particles without taking over the flight.
• Commit Grid: Rounded tonal cells breathe through eight motion patterns. Hover to light nearby cells or click to send a soft ripple through the grid.
• Contour: Closed contour lines wrap around three soft hills. Your cursor raises a local summit and leaves a gently settling elevation wake.
• Cosmic Horizon: A vast dark planet meets a thin sunlit horizon and a deep atmospheric bloom. Slow surface drift and sparse stars establish scale; the cursor gently shifts the planet beneath the light.
• Crosslight: Two sheets of light cross in a quiet luminous seam. Opposing slopes and a spring-soft pointer trail create depth without heavy rendering.
• Cube: A crisp cube turns slowly through a fine square mesh. Your cursor tilts its faces while back edges fade into depth.
• Data Bend: A luminous data sheet flows from the foreground through a rounded bend and climbs into an endless wall of qubit trails. Companion particles follow the turn. Hover over a trail to illuminate its full length, or over a particle to brighten it.
• Data Infinity: A thin plane of luminous qubit trails and companion particles streams from behind the camera toward infinity. Straight lanes converge into the distance, with glowing signals flowing alongside them. Move your pointer over the signals to illuminate nearby trails and particles.
• Dotted Aura: A quiet circular aura emerges from a fine field of dots. Moving highlights travel around its rim; your cursor stirs a local wake and brightens nearby dots.
• Drift: Layered dust floats at different depths. Your cursor gently parts the field, leaving a delayed luminous wake.
• Dune: Long wind-carved ridges fold into a soft dune field. Move the pointer to lift a sandbank and draw a trailing curve.
• Earth: Continents emerge from thousands of individual glowing dots on a rotating globe, with open oceans and no solid skin. Lines mode adds a fine spherical wireframe beneath the dotted continents, with no solid skin. Your cursor gently tilts the world.
• Ember: Warm sparks rise with depth and flickering light. The pointer pushes them aside while a soft wake follows your movement.
• Ember Folds: Stationary charcoal shapes form stacked folds or a touching pattern, with soft ember light creeping along their edges. Hover to draw the concealed light toward the cursor.
• Event Horizon: A black circular shadow framed by flowing accretion light and spiraling particles on a fixed black background. Color 1 controls the inner glow, color 2 the outer glow, and color 3 the stars and particles. Hover to disturb the nearby particle flow.
• Facet Field: A deep field of triangular facets catches a concentrated light, opening into a warm crystalline relief. Move your cursor to rake light across the folds.
• Fan: Soft rays open from a point below the frame. A slow pivot and drifting highlights give the light a sculptural, architectural feel.
• Fault Lines: Irregular charcoal plates rise above deep illuminated seams. Slow shifts in elevation catch the studio light; hover to lift nearby plates and brighten their seams.
• Filament: Fine upright strands sway in a continuous flow. Your cursor parts the lines and draws a soft, delayed fold through them.
• Firefly: Six sparkling heads dart and wander independently, each leaving a short particle wake. Choose an organic, infinity, circle, or orbit path; your cursor disperses nearby particles without taking over the flight.
• Flock: Loose ribbons of points move in a coordinated wave. Your cursor lifts the flock into a local curl and a trailing fold.
• Fog: Layered mist drifts through soft shafts of light. Your cursor parts and stirs the nearby fog.
• Fur: A dense field of tapered fibers catches soft studio light. Shaded roots and luminous tips reveal the depth of the pile; move your cursor to gently comb the strands.
• Geodesic: A triangulated geodesic sphere breathes slowly. Its delicate facets rotate with your cursor and fade into darker edges on the far side.
• Glacial: Thick, luminous ice refracts soft pigment beneath its surface. The cursor bends the glass and releases delicate fading ripples.
• Glass: Overlapping lenses follow with different weight, magnifying color locally and catching light along their rims.
• Globe: A fine latitude-and-longitude globe turns in perspective. Cursor movement tilts its axis while front-facing meridians catch a soft highlight.
• Halftone: Staggered ink dots expand and contract with a rolling field. Your cursor lifts the print into a local highlight that softly settles.
• Halo: An elliptical ring breathes in the dark, carrying a silver highlight around its rim. Pointer movement gently shifts its center.
• Helix: Three braided particle trails drift around one another on slow, looping paths. Choose an organic, infinity, circle, or orbit path; your cursor disperses nearby particles without taking over the flight.
• High Plains: Fine wire terrain drifts through layered ridges. Hover to lift broad plateaus from the surface; the land settles gently when your cursor moves away.
• Infinite Funnel: An unbroken wireframe funnel bends into the distance. Rings flow toward you without a restart while the curved walls draw you deeper; move your cursor to shift the perspective.
• Ink Bloom: Ink continuously blooms outward from the center into a uniform solid color. Overlapping pigment fronts unfurl into translucent curls and feathered wisps, dissolving as fresh ink expands from within. Hover to diffuse and blend the pigment locally; the mixed areas linger and gradually settle.
• Ion Tunnel: Travel steadily through a continuous cave of electric filaments. Fixed, bumpy wall layers pass the camera with depth parallax and a circular opening ahead. Hover to energize nearby wires.
• Kinetic: An elastic grid gathers beneath the pointer. Click to send a bright, expanding wave through its lines and dots.
• Knot: A continuous torus knot loops through a fine three-dimensional mesh. Your cursor tilts the sculpture while highlights travel around its folds.
• Lattice: A precise diamond lattice stretches locally, revealing a cool highlight that follows your cursor with a delayed spring.
• Lava: Glowing pools rise, drift together and pull apart into soft, rounded blobs. Randomized sizes and independent motion keep the liquid changing. Move your cursor to gently push the flow.
• Liquid Chrome: A slow-moving sheet of liquid chrome folds through dark pools and broad studio reflections. Move your cursor to press into the surface and draw a soft metallic wake.
• Liquid Droplets: Glossy liquid pools rise from one continuous violet and pink surface. Drag your cursor to swirl and stretch the entire liquid field, blending pigment into flowing tendrils. Click to send a ripple through the pools.
• Liquid Laminar: Coral and cobalt pigment flows beneath undulating glass. Surface normals bend the light while cursor pressure and a delayed wake sculpt the liquid.
• Logo Lab: Sculpt the Striktly wordmark or your own SVG or transparent logo on a reflective studio stage. Soft shadows, cutout shading and studio lights reveal its depth. Move to tilt, or drag to rotate.
• Membrane: A stretched pearlescent skin catches soft studio light. Cursor pressure creates a local depression with a spring-soft rebound.
• Mercury: Broad rounded folds carry polished reflections. Cursor pressure dents the metal and leaves a weighty reflective wake.
• Meridian: Nested orbital contours breathe around a quiet center. The pointer bends the rings locally while a soft wake trails behind.
• Mesh Ribbon: Fine colored strands twist into a soft, open mesh wave. Slow folds change its silhouette while your cursor gently lifts nearby threads and leaves a delayed wake.
• Moiré: Overlapping fine gratings create broad interference waves. Your cursor changes their local alignment and opens rippling bands.
• Mosaic: Small glazed tiles catch shifting color and a fine edge highlight. Your pointer swirls the mosaic into a coherent, delayed wave.
• Obsidian Burst: A dense cluster of sharp obsidian shards turns in darkness, catching restrained blue-gray reflections and amber glints. Your cursor rotates the sculpture.
• Oilskin: A dark liquid surface reveals shifting thin-film color in its reflective folds. Slow cursor pressure stretches the sheen into a lingering wake.
• Orbit: Four spiraling arms turn at different speeds around a quiet center. The pointer twists nearby stars into a brief orbital eddy.
• Photon Fabric: A regular lattice of luminous dots folds into a flowing wave. Blue shadows meet bright warm crests, while foreground points soften through depth. Your cursor lifts and swirls the local fabric.
• Plasma Halo: A luminous plasma ring bends through a crisp pixel field. Its rim breathes and fractures into tonal cells as the cursor stirs the energy; optional edge light frames the scene.
• Point Form: Organic ink dots bloom from the bottom upward, spreading in uneven clusters across a flat field. Each dot grows at its own pace; hover to encourage the ink around your cursor.
• Prism: An oblique sheet of violet, pink and blue light drifts across a dark field, with fine grain and a weighty pointer glide.
• Proximity: A field of fine dots grows into a soft proximity mask beneath your cursor. Click waves bloom outward and slowly dissolve.
• Reaction Diffusion: A small GPU reaction-diffusion simulation grows branching cultures and winding labyrinths. Move your cursor to seed new pigment into the evolving field.
• Refracted Glass: Sculptural glass objects catch cyan, violet and pink studio reflections. Choose a cube, sphere, triangular frame, pyramid or looping sculpture; your cursor rotates the glass and reveals its changing reflections.
• Ribbon: A slender ribbon of light folds across a dark field. Its curved edge follows your cursor with a soft, weighty glide.
• Ridgeline: Fly through a valley of glowing wireframe ridges. A scan pulse travels across the landscape as distant peaks fade into fog. Your cursor leans and glides the camera.
• Riso Dither: Wind-swept ribbons resolve into a crisp Bayer dither pattern. Cursor movement bends the flow and draws a brighter core through the ink.
• Rorschach: Mirrored inkblots slowly bloom, join and pull apart around a central fold. Feathered edges and pools of pigment keep each shape organic; move your cursor to gently reshape both sides at once.
• Silk: Slow satin folds shear beneath your cursor, catching a highlight that stretches into a soft trailing wake.
• Soft Cells: Bubbles of different sizes drift together, squeeze past their neighbors and open into soft, rounded connections. Independent motion keeps the cells mixing; move your cursor to gently stir them.
• Soft Resin: Rounded translucent forms merge into a soft liquid body. Cursor attraction slowly pulls the resin while highlights describe its thickness.
• Sonar: Soft rings brighten a precise dot field. striktly pings arrive slowly; click anywhere to add your own expanding signal.
• Spectral Glass: Dark, irregular glass panels catch drifting red and blue light. Thin prismatic seams split into spectral highlights, while softer reflections travel behind the glass. Hover to draw light into nearby panels.
• Strata: Quiet horizontal layers form rolling horizons. A local cursor lift gives their fine lines a soft, tactile response.
• Stream: Fine luminous streaks travel in parallel currents. Cursor movement parts the flow and pulls a soft directional wake.
• Terrain: A receding wire grid rolls gently toward the horizon. Pointer movement lifts the surface; clicks travel across it as light waves.
• Tidal Glass: Overlapping water swells refract a smoky luminous bed. Moving the cursor adds a pressure hollow and small expanding wavelets.
• Tide: Thousands of fine points form a rolling, tilted wave field. Move your cursor to lift a local crest and draw a soft wake.
• Torus: A sculptural ring turns through a precise wire mesh. Perspective, quiet breathing, and an eased cursor tilt reveal its depth.
• Trace: Fine spirals glide through soft figure-eight paths, leaving a delicate fading wake. Choose an organic, infinity, circle, or orbit path; your cursor disperses nearby particles without taking over the flight.
• Velour: Broad luminous folds drift through a softly grained dark field. A growing glow swells outward and fades in a repeating pulse; your cursor gently parts and bends the nearby veils.
• Vitreous: A softly rippled glass surface refracts silver light around a deep central shadow. A physical spring carries the cursor through its surface, matching the Layers hero composition.
• Vortex: Orbiting particle trails swirl around moving centers with broad, fading curls. Choose an organic, infinity, circle, or orbit path; your cursor disperses nearby particles without taking over the flight.
• Warp Tunnel: Projected stars stream through depth toward the camera. Cursor steering bends their flight while depth-aligned streaks catch the light.
• Wisp: Weightless spirals float slowly across the canvas on gentle wandering paths. Choose an organic, infinity, circle, or orbit path; your cursor disperses nearby particles without taking over the flight.
• Worm Hole: An immersive journey inside a glowing wormhole. Smooth walls twist around a luminous core as rolling waves spiral outward and sweep past the camera. Move your pointer to shift your view through the passage.