This is a cosine gradient generator implemented with Elm 0.19.
The idea of a cosine gradient is pretty famous among creative coders, each RGB component is modulated with a cosine function.
<div class="math math-display"><math xmlns="http://www.w3.org/1998/Math/MathML" display="block"><semantics><mrow><mi>r</mi><mo>=</mo><msub><mi>A</mi><mi>r</mi></msub><mi>cos</mi><mo>⁡</mo><mrow><mo stretchy="false">(</mo><msub><mi>f</mi><mi>r</mi></msub><mi>t</mi><mo>+</mo><msub><mi>p</mi><mi>r</mi></msub><mo stretchy="false">)</mo></mrow><mspace linebreak="newline"></mspace><mi>g</mi><mo>=</mo><msub><mi>A</mi><mi>g</mi></msub><mi>cos</mi><mo>⁡</mo><mrow><mo stretchy="false">(</mo><msub><mi>f</mi><mi>g</mi></msub><mi>t</mi><mo>+</mo><msub><mi>p</mi><mi>g</mi></msub><mo stretchy="false">)</mo></mrow><mspace linebreak="newline"></mspace><mi>b</mi><mo>=</mo><msub><mi>A</mi><mi>b</mi></msub><mi>cos</mi><mo>⁡</mo><mrow><mo stretchy="false">(</mo><msub><mi>f</mi><mi>b</mi></msub><mi>t</mi><mo>+</mo><msub><mi>p</mi><mi>b</mi></msub><mo stretchy="false">)</mo></mrow><mspace linebreak="newline"></mspace><mtext>color</mtext><mo>=</mo><mo stretchy="false">(</mo><mi>r</mi><mo separator="true">,</mo><mi>g</mi><mo separator="true">,</mo><mi>b</mi><mo stretchy="false">)</mo></mrow><annotation encoding="application/x-tex">r = A_r\cos{(f_r t + p_r)} \\ g = A_g\cos{(f_g t + p_g)} \\ b = A_b\cos{(f_b t + p_b)} \\ \text{color} = (r,g,b)</annotation></semantics></math>r=Ar​cos(fr​t+pr​)g=Ag​cos(fg​t+pg​)b=Ab​cos(fb​t+pb​)color=(r,g,b)</div>
This results in a surprising variety of color gradients which can easily be modulated in the range [0, 2π).
In this experiment, I tried implementing other color spaces to see what other kinds of gradients could be made.
There is also a simple code snippet for GLSL and Unity which can be copy pasted for ease of use.
<img src="/img/projects/grad/grad.png" alt="">

Grad