Domain Warping Shaders for Organic Marble
Build organic marble from deterministic domain warping with bounded fBm, coordinate diagnostics, derivative-aware detail, authored color, motion restraint, and edition proof.
Domain warping shaders make organic marble by bending the coordinates used to sample a field, so straight periodic structure becomes folded, nested, and vein-like.
This guide builds a deterministic WGSL study with bounded fBm, visible coordinate diagnostics, derivative-aware detail, an authored stone palette, restrained motion, and an edition receipt that can reproduce the exact frame.
Domain warping shaders begin with coordinates
Render the unwarped UV grid, aspect-correct it, choose world scale, and freeze a coordinate convention before sampling noise. If the base domain stretches with the viewport, the same preset will not produce the same stone composition across exports.
Freeze a coordinate grid before asking for stone. Normalize scale, aspect ratio, object or world space, and tiling behavior, then render the grid as a diagnostic.
Every later fold should be recognizable as a transformation of this domain rather than an arbitrary pattern that only looks organic at one camera angle. Inside domain warping shaders, the shader diagnostic treats procedural marble as evidence the material author can contest. A known domain gives every later organic gesture a visible origin.
Make a coordinate diagnostic plate answerable to the shader diagnostic, with resolution, aspect transform, origin, scale, rotation, crop, and canonical export domain visible on its face. The material author should not need oral history to inspect it.
- Grid: Freeze the domain
- Warp A: Set the flow
- Warp B: Break the edge
- Vein: Shape and color
Choose a deterministic scalar field
Implement one bounded noise or value field with explicit hash, interpolation, seed, and numeric range. Verify continuity and repeatability before stacking octaves; visual complexity should not conceal a discontinuity or platform-sensitive random source. The material author views this domain warping shaders decision from the angle fBm warping gives the shader diagnostic. Simple field diagnostics prevent a biased noise source from becoming expensive marble.
Choose the counterexample compare fixed sample coordinates across CPU and GPU implementations. The shader diagnostic gives the material author a stop signal when the same uniforms produce a different field after reload.
Choose a deterministic scalar field whose range and repetition are understood. Hash or gradient noise, seed, precision, and coordinate convention shape the material before fBm adds complexity. Plot values and gradients on a small lattice so discontinuities or directional bias are found while the field is still simple.
The coordinate technique and shader language meet in Inigo Quilez domain warping, and WebGPU Shading Language specification. Quilez demonstrates the expressive structure of nested coordinate warps and the WGSL specification defines the shader language contract. The article treats the result as procedural marble imagery, not a physical simulation of mineral formation.
Build fBm with a frequency budget
Let compare zoom levels with and without the highest octave bands produce the comparison case for an octave contribution chart. Where they diverge, the material author has found the next shader diagnostic edit.
Add octaves through named frequency and amplitude ratios, then stop when higher bands cannot survive target pixels or print dots. Unbounded high-frequency detail aliases into glitter and makes a still frame depend on subpixel sampling rather than authored structure.
Fractal Brownian motion (fBm) is a frequency budget, not a ritual loop. Assign octave count, lacunarity, gain, and amplitude cap according to the visible scale each band should contribute.
More octaves can add cost and brittle sparkle without improving the large geological flow that makes marble recognizable. By constraining WGSL shader, the shader diagnostic makes one part of domain warping shaders legible to the material author. Frequency bands become useful when each one has a distinct, visible compositional assignment.
Visualize the first coordinate warp
The first warp should remain legible in a debug view. Use low-frequency fields to displace coordinates, render the bent grid, and inspect fold direction, crowding, and empty regions.
If the domain already tangles here, nesting another warp will amplify confusion rather than create richer structure. This is where the material author asks the shader diagnostic to turn organic texture into a real domain warping shaders test. The bent grid is the most direct portrait of what the first warp actually did.
The shader diagnostic advances only after a warp-vector atlas contains input coordinate, vector sample, amplitude, displaced coordinate, Jacobian estimate, and bounds. Otherwise the material author records a blocked handoff.
Sample a low-frequency vector field and add its scaled result to the domain, then render the displaced grid or vector arrows directly. This diagnostic reveals folds, directional bias, seams, and amplitude collapse before a palette makes them difficult to distinguish.
Nest warps without losing hierarchy
Use one or two additional field evaluations to bend the sampling domain at distinct scales, preserving a dominant flow and finer vein turbulence. Name the dependency graph so parameter editing remains causal rather than a pile of magic constants.
Use disable each stage and describe the specific compositional role that disappears as the stressor. If several warps contribute indistinguishable noise, the material author rejects the current shader diagnostic assumption.
Once procedural marble moves, the material author no longer accepts the same domain warping shaders answer from the shader diagnostic. Nested motion feels rich when the coarse flow remains readable underneath it.
A second warp can break symmetry and add turbulence when its amplitude and frequency occupy a distinct role. Feed the first warped position into another bounded vector field, but preserve debug outputs for both stages. The composition gains depth when broad flow survives beneath smaller agitation. Stage thumbnails make those scale relationships easy to critique.
Shape veins from a stable field
Transform the final scalar through periodic bands, absolute distance, smooth thresholds, or a controlled combination to create veins and stone mass. Keep width and softness in domain units tied to derivatives so fine veins do not vanish or explode with resolution.
Once sweep zoom and motion while inspecting the thinnest retained vein is reproducible, add the difference to a vein transfer curve. The shader diagnostic becomes a debugging surface the material author can share. Use the shader diagnostic to expose what fBm warping says about the domain warping shaders default owned by the material author. Separate vein shaping keeps geometry and mineral contrast independently art-directable during iteration.
Veins emerge from shaping the final scalar field. Periodic bands, absolute value, smooth thresholds, and derivative-aware widths can create pale and dark mineral boundaries without hard aliasing. Keep the transfer curve separate from coordinate motion so material contrast can change without reauthoring the geometry.
| Stage | Frequency | Amplitude | Visual role |
|---|---|---|---|
| Base | 1× | — | Stone mass |
| Warp A | Low | Strong | Flow |
| Warp B | Mid | Subtle | Turbulence |
| Vein | High | Bounded | Edge |
Author color as material hierarchy
The material author gets an explicit domain warping shaders control when the shader diagnostic names WGSL shader. Color completes the stone only after its luminance structure can stand alone.
Palette is material hierarchy. Map base stone, cloudy body, thin vein, and occasional accent through controlled luminance and chroma relationships, then inspect in grayscale and the target color space. A striking wide-gamut accent should not erase the depth cues carried by the underlying field.
Map stone base, cloudy body, primary veins, and rare accents through an explicit palette rather than applying a rainbow ramp to raw noise. Check luminance structure independently, then consider wide gamut only with a safe sRGB fallback.
Bind role, color space, value, luminance, blend rule, gamut fallback, and contrast note to a marble palette ledger for the life of the decision. That is what makes the shader diagnostic reviewable by the material author later. Proofs should include grayscale and compressed social-card variants.
Animate the domain with restraint
Intentionally compare first and final loop frames and capture a reduced-motion still. The shader diagnostic has revealed its own limit if motion changes the composition faster than a viewer can inspect it, and the material author owns the repair.
Animation should move geological time, not slide noise across a surface. Slowly vary a bounded field parameter or travel through a higher-dimensional domain while preserving the main fold. Honor reduced motion and keep a still edition whose composition does not depend on continuous movement.
If motion supports the piece, move low-frequency phase or coordinates slowly and loop through a deterministic path. Honor reduced motion and avoid independently animating every octave, which reads as boiling noise rather than a coherent material flow. Unless organic texture survives the hard case, the material author regards the shader diagnostic's domain warping shaders evidence as partial. A still-first composition makes motion an extension rather than a readability requirement.
The generative-material lineage runs through reaction diffusion WebGPU art, quasicrystal five-wave shaders, WebGPU generative art, and Display P3 color systems. Reaction diffusion, wave interference, WebGPU delivery, and wide-gamut color create neighboring visual systems with different claims. Keeping their algorithms named prevents a polished shader from turning every organic pattern into marble physics.
- 1Grid
Freeze the domain
- 2Warp A
Set the flow
- 3Warp B
Break the edge
- 4Vein
Shape and color
Archive the shader as an edition
The material author releases the shader diagnostic only when a procedural marble receipt agrees with a run that can regenerate a canonical frame on a clean compatible device and compare samples. A mismatch remains an open decision. The final domain warping shaders check asks the shader diagnostic to make procedural marble reproducible for the material author. Intermediate passes turn procedural surprise into a reproducible artistic edition.
Store WGSL, uniform schema, values, seed, resolution, color profile, device and browser notes, still fallback, and output digest. Include the coordinate and warp diagnostics so another artist can understand the construction without reverse-engineering the final marble.
Archive the shader with WGSL source, seed, constants, coordinate convention, palette, resolution, device notes, compiler and browser versions, debug passes, and final digest. The grid and intermediate fields are part of the artwork's provenance because they show exactly where authored structure entered the organic result.
The deterministic field fixture samples a bounded nested warp and catches non-finite or runaway values before WGSL rendering.
Runnable artifact — domain-warp-field.test.mjs
import assert from "node:assert/strict";
const noise=(x,y)=>Math.sin(x*1.7+y*.9)*.5+.5;const fbm=(x,y)=>{let sum=0,amp=.5;for(let octave=0;octave<4;octave++){sum+=amp*noise(x,y);x*=2;y*=2;amp*=.5}return sum};
const field=(x,y)=>{const qx=fbm(x,y),qy=fbm(x+5.2,y+1.3),rx=fbm(x+1.8*qx,y+1.8*qy),ry=fbm(x+4+1.2*qx,y+2+1.2*qy);return Math.sin((x+1.35*rx)*3.2)+.22*ry};
const grid=Array.from({length:256},(_,i)=>field((i%16)/8,Math.floor(i/16)/8));assert.ok(grid.every(Number.isFinite));assert.ok(grid.every(v=>Math.abs(v)<=1.23));assert.deepEqual(grid,Array.from({length:256},(_,i)=>field((i%16)/8,Math.floor(i/16)/8)));
console.log("PASS: marble field stays bounded");
Run node domain-warp-field.test.mjs. Expected receipt: PASS: marble field stays bounded.
Build domain warping shaders from a small deterministic field whose coordinate transforms can be visualized before color. Reopen the edition when noise, warp amplitudes, frequency content, palette, motion, WGSL compiler, or export surface changes.