Shader Palette Generator
Design cosine-based color palettes for GLSL shaders. Drag the twelve parameters, watch four live shaders react, then copy the palette function straight into your code.
// https://tools.earthling.dev/palette?p=0.5,0.5,0.5,0.5,0.5,0.5,1,1,1,0,0.33,0.67
vec3 palette(float t){
vec3 a=vec3(0.5,0.5,0.5);
vec3 b=vec3(0.5,0.5,0.5);
vec3 c=vec3(1,1,1);
vec3 d=vec3(0,0.33,0.67);
return a+b*cos(6.28318*(c*t+d));
}Saved palettes are kept in this browser only. Save one to come back to it later.
Procedural palette generation
This tool builds color palettes for GLSL shaders from a short mathematical formula. The technique was explained and popularised by Inigo Quilez, whose articles on computer graphics and procedural generation are the standard reference for it.
The formula produces smooth, cyclical color transitions — useful for adding variation to procedural elements, colorizing grayscale signals or driving visual effects:
color(t) = a + b * cos(2π(c*t + d))
t is the input, normally 0 to 1, and a, b, c and d are three-component vectors — one value per color channel — that shape the palette. a sets the midpoint, b the contrast, c how many cycles the palette runs through and d the phase offset per channel.
Drag the sliders to change those twelve numbers. The strip and the four example shaders update in real time, the address bar keeps a shareable link to the current palette, and the generated GLSL below can be pasted straight into a shader. For the full explanation of the technique, read Inigo Quilez’s Palettes article.
Related tools
Free and open source from Earthling Digital, an independent creative agency. Built with Earthling UI.