Godot UV Shader Visualizer

Uniforms (Params)

TIME (sec)0.00

Shader Code

// A classic cosine-based color palette generator
// It outputs beautiful, perfectly looping gradients based on time.
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.0, 1.0, 1.0);
    vec3 d = vec3(0.263, 0.416, 0.557);
    return a + b * cos(6.28318 * (c * t + d));
}

void fragment() {
    // Shift UVs from (0.0 to 1.0) to (-1.0 to 1.0) so (0,0) is in the dead center
    vec2 uv = (UV - 0.5) * 2.0;
    vec2 uv0 = uv; // Save the original coordinates
    vec3 finalColor = vec3(0.0);

// Loop to create fractal-like nested patterns
    for (int i = 0; i < 4; i++) {

// fract() splits the screen into repeating grid boxes (Space Folding!)
        uv = fract(uv * p1) - 0.5;

// Calculate distance from center, distorted by the original center's pull
        float d = length(uv) * exp(-length(uv0));

// Get our shifting neon color based on distance and TIME
        vec3 col = palette(length(uv0) + float(i) * p2 + TIME * 0.4);

// Create the expanding wave rings
        d = sin(d * p3 + TIME) / p3;

// Use absolute value to make the waves hollow rings instead of solid blobs
        d = abs(d);

// Inverse math creates the intense "glowing neon" edge effect
        d = pow(0.01 / d, 1.2);

// Add this layer of the fractal to the final image
        finalColor += col * d;
    }

COLOR = vec4(finalColor, 1.0);
}

Hover over canvas to probe:

UV: (0.000, 0.000)

COLOR Output: vec4(0.00, 0.00, 0.00, 1.00)

(0,0)

UV.x → (1.0)

UV.y → (1.0)

Godot WebGL Shader Visualizer

Uniforms (Params)

Shader Code