Shaders and presets
Shaders
Standalone GLSL shader collection for Three.js
The strata-game-library/shaders package provides a standalone collection of production-ready GLSL shaders. Use them with any Three.js project — no React required.
Installation
pnpm add strata-game-library/shadersAvailable Shaders
Terrain
Shaders for procedural terrain rendering with height-based texture blending and triplanar mapping.
- Terrain Shaders — Triplanar texturing, biome blending, erosion effects
Water
Realistic water rendering with wave simulation and reflections.
- Water Shaders — Gerstner waves, Fresnel reflections, caustics
Sky & Atmosphere
Physically-based atmospheric scattering for realistic skies.
- Sky Shaders — Rayleigh/Mie scattering, day/night cycle
Clouds
Volumetric cloud rendering.
- Cloud Shaders — Ray-marched clouds, weather systems
Volumetric Effects
Fog, god rays, and underwater overlays.
- Volumetric Shaders — Distance fog, volumetric light, underwater
Material Effects
Advanced material shaders for special effects.
- Material Shaders — Fur, hologram, toon, scanline, glitch
Vegetation
Wind animation for instanced vegetation.
- Vegetation Shaders — Wind bending, sway, seasonal color
Usage Without React
All shaders can be used directly with Three.js:
import { waterFragmentShader, waterVertexShader } from 'strata-game-library/shaders';
const material = new THREE.ShaderMaterial({
vertexShader: waterVertexShader,
fragmentShader: waterFragmentShader,
uniforms: {
uTime: { value: 0 },
uWaveHeight: { value: 1.0 },
uWaterColor: { value: new THREE.Color('#006994') },
},
});Shader Chunks
Reusable GLSL snippets for building custom shaders:
import { ShaderChunks, noiseSnippet } from 'strata-game-library/shaders';
// Use noise functions in your own shaders
const customShader = `
${noiseSnippet}
void main() {
float n = fbm(vPosition.xz * 0.1);
gl_FragColor = vec4(vec3(n), 1.0);
}
`;Full API Reference
See the detailed TypeDoc documentation for all exported shaders, uniforms, and types.
