Skip to content

Shaders

Shaders are small programs that run on the GPU to control how graphics are rendered. They allow full control over the appearance of 3D objects, from simple color modifications to complex lighting, post-processing, and procedural effects.

Custom shaders in Lemonate

Use TSL (Three.js Shading Language) for all new custom shading. You author a TSL Shader project item and link it from a Material (material type Node) or from a Scene background.

TSL shaders are documented in detail in TSL Shaders. Studio ships templates for lit materials, backgrounds, vertex wind, and stylized water.

Typical uses:

  • Materials — surface color, transparency, vertex displacement, texture sampling (including composition outputs for refraction and similar effects).
  • Scene backgrounds — procedural skies, gradients, and full-screen effects when Background mode is Shader.

Deprecated GLSL shader items

Older projects may still contain Pixel Shader, Vertex Shader, or Background Shader items (GLSL source files). The engine continues to compile and run these when they are already linked to a material or scene. They are deprecated though and will be removed from the engine when we switch from WebGL to WebGPU.

New GLSL shader items cannot be created in Studio. Do not start new work with GLSL — use TSL Shader items instead.

If you maintain a legacy project that still uses a GLSL background shader, uniforms can be updated at runtime via Renderer.setBackgroundShaderUniform.