/* https://grabient.com/_gIagH1gJDgJtgL4gIjgDFgFrgDZhBdggugAAgAuewIWR?style=linearSwatches&steps=34&angle=135 */ background: linear-gradient(135deg, #030037 0.000%, #030037 2.941%, #050033 calc(2.941% + 1px), #050033 5.882%, #080030 calc(5.882% + 1px), #080030 8.824%, #0b002c calc(8.824% + 1px), #0b002c 11.765%, #0e0029 calc(11.765% + 1px), #0e0029 14.706%, #110026 calc(14.706% + 1px), #110026 17.647%, #140023 calc(17.647% + 1px), #140023 20.588%, #180021 calc(20.588% + 1px), #180021 23.529%, #1b001e calc(23.529% + 1px), #1b001e 26.471%, #1f001c calc(26.471% + 1px), #1f001c 29.412%, #23001a calc(29.412% + 1px), #23001a 32.353%, #270018 calc(32.353% + 1px), #270018 35.294%, #2c0017 calc(35.294% + 1px), #2c0017 38.235%, #300016 calc(38.235% + 1px), #300016 41.176%, #350514 calc(41.176% + 1px), #350514 44.118%, #390e14 calc(44.118% + 1px), #390e14 47.059%, #3e1913 calc(47.059% + 1px), #3e1913 50.000%, #432313 calc(50.000% + 1px), #432313 52.941%, #482f12 calc(52.941% + 1px), #482f12 55.882%, #4d3a13 calc(55.882% + 1px), #4d3a13 58.824%, #534613 calc(58.824% + 1px), #534613 61.765%, #585213 calc(61.765% + 1px), #585213 64.706%, #5d5f14 calc(64.706% + 1px), #5d5f14 67.647%, #636c15 calc(67.647% + 1px), #636c15 70.588%, #687817 calc(70.588% + 1px), #687817 73.529%, #6e8518 calc(73.529% + 1px), #6e8518 76.471%, #73921a calc(76.471% + 1px), #73921a 79.412%, #799f1c calc(79.412% + 1px), #799f1c 82.353%, #7fab1e calc(82.353% + 1px), #7fab1e 85.294%, #84b720 calc(85.294% + 1px), #84b720 88.235%, #8ac323 calc(88.235% + 1px), #8ac323 91.176%, #90cf25 calc(91.176% + 1px), #90cf25 94.118%, #95da28 calc(94.118% + 1px), #95da28 97.059%, #9be52c calc(97.059% + 1px) 100.000%);

["#030037", "#050033", "#080030", "#0b002c", "#0e0029", "#110026", "#140023", "#180021", "#1b001e", "#1f001c", "#23001a", "#270018", "#2c0017", "#300016", "#350514", "#390e14", "#3e1913", "#432313", "#482f12", "#4d3a13", "#534613", "#585213", "#5d5f14", "#636c15", "#687817", "#6e8518", "#73921a", "#799f1c", "#7fab1e", "#84b720", "#8ac323", "#90cf25", "#95da28", "#9be52c"]

// https://grabient.com/_gIagH1gJDgJtgL4gIjgDFgFrgDZhBdggugAAgAuewIWR?style=linearSwatches&steps=34&angle=135 // cosine gradient palette — https://iquilezles.org/articles/palettes/ const float STEPS = 34.0; const float ANGLE = 135.0; vec3 palette(float t) { vec3 a = vec3(0.538, 0.501, 0.579); vec3 b = vec3(0.575, 0.704, 0.507); vec3 c = vec3(0.203, 0.375, 0.224); vec3 d = vec3(3.566, 1.471, -0.623); return a + b * cos(6.283185 * (c * t + d)); } // N hard swatches sampled from the palette vec3 stops(float t) { float i = min(floor(clamp(t, 0.0, 1.0) * STEPS), STEPS - 1.0); return palette(i / (STEPS - 1.0)); } void mainImage(out vec4 fragColor, in vec2 fragCoord) { vec2 p = fragCoord - 0.5 * iResolution.xy; // CSS angle: 0 = up, clockwise; span = CSS gradient-line length vec2 dir = vec2(sin(radians(ANGLE)), cos(radians(ANGLE))); float len = abs(iResolution.x * dir.x) + abs(iResolution.y * dir.y); float t = dot(p, dir) / len + 0.5; fragColor = vec4(stops(t), 1.0); }

Rainbow dark navy to greenish brown to ugly green to kiwi green gradient palette editor

Rainbow dark navy to greenish brown to ugly green to kiwi green