Built-in GLSL effects
Background & Halo Shaders
Four overlapping sine waves produce a lava-lamp gradient that continuously morphs between two accent colours.
plasma lava-lamp lavaDiagonal flowing bands in cool blues and greens shimmer like the northern lights behind your content.
auroraFlame noise halo surrounds the element boundary. The background darkens at centre for text legibility.
fire flame flamesParticle sparks scatter outward from the element. A dark background with embedded spark points rounds out the effect.
sparks spark particlesCaustic interference rings ripple across the surface using a vertex-displaced plane for a water-surface illusion.
ripple waveTileable caustic turbulence — five layers of iterated trigonometric interference produce shifting light patterns like sunlight refracting through shallow water. Ported from Tileable Water Caustic by David Hoskins (Shadertoy MdlXz8).
water causticThree independent lens-distortion channels split into chromatic bands — a vivid spectral swirl radiating from the centre. Ported from Creation by Silexars by Danguafer (Shadertoy XsXXDn).
prism rainbow lensVoronoi crystal facets create a frosted-glass texture. Crisp cell edges glow at the boundary halo.
frost ice crystalOverlay Shaders
Iridescent iridescent background tint with a sweeping rainbow scan-line that drifts continuously upward.
holographic holoRandom horizontal band offsets, scanlines, chromatic shift, and ghost-strip overlays simulate a corrupt signal.
glitch corrupt digitalIterative UV folding creates an infinite-tunnel depth illusion with pulsing iridescent edge rings.
mirror tunnel infiniteA pulsing bloom ring halo wraps the element boundary. Text is automatically coloured to match the accent hue.
neon glowComposing & Options
Multiple shader modes can be composed by passing a comma-separated string. Each mode's layers are applied in order — here the neon halo rings wrap a glitching background, and the auto-contrast system sets the text to the neon accent colour.
neon glitchData-Attribute API
Any element can receive a shader entirely in HTML using data-{namespace}-shader attributes. Set the mode, colours, speed, and intensity inline — Fold picks them up automatically at initialisation. The cards below are all driven this way.
Orange-to-red palette via data-foldpage-shader-color="#ff9900,#cc2200". Speed pushed to 1.6, intensity at 0.85.
A single colour drives the pulsing halo ring and sets the text accent automatically. Swap any hex for an instant recolour.
neonThree-colour palette for a cooler, more electric lava-lamp. Speed dialled back to 0.8 for a slower morph.
plasmaShifted palette from the default blues into a green-to-violet sweep. Slower speed gives a languid shimmer.
auroraDefault spectral palette at 1.4× speed. The chromatic bands rotate noticeably faster — no extra markup needed.
prismFactor pushed above 1 amplifies the band offsets and chromatic aberration beyond the default, for a more aggressive corruption effect.
glitchTwo-colour ocean palette replaces the default teal. The missing third colour is auto-blended as a midpoint between the two.
rippleLightened palette with a very slow drift gives a still, crystalline look rather than the colder default blue-grey.
frost