GLSL linear gradient

linear-gradint.frag

// Author: rileyjshaw
// Title: Linear gradient

#ifdef GL_ES
precision mediump float;
#endif

uniform vec2 u_resolution;
uniform vec2 u_mouse;
uniform float u_time;

float map(float x, float min1, float max1, float min2, float max2) {
   return (x - min1) / (max1 - min1) * (max2 - min2) + min2;
}

void main() {
    // (0, 1).
    vec2 st = gl_FragCoord.xy/u_resolution.xy;
    st.x *= u_resolution.x/u_resolution.y;

    vec2 dir = vec2(0.850,-0.540);  // Change me!
    float magnitude = length(dir);
    float angle = atan(dir.y, dir.x);

	// We want the maximal black/white points to land at the corners of
    // the viewbox. That means that our gradient will exist in an angled
    // square that's actually bigger than the viewbox. We want it to be
    // the smallest angled square possible that encloses the viewbox;
    // the math works out so the side length is 2*(cosϴ+sinϴ) when the
    // viewbox sides are length 2 (i.e. coordinates -1 to 1).
    float range = 2. * (cos(angle) + sin(angle));

    // (-range, range).
    st = st * range * 2. - range;

    float mag = dot(normalize(dir), st);
    vec3 color = vec3(map(mag / magnitude, -range, range, 0., 1.));
    gl_FragColor = vec4(color,1.);
}