/* https://grabient.com/_f-ef-ef-egGYgGYgGYgPngPngPnf9IgAAgC3oOvovogA?style=linearSwatches&steps=34&angle=90 */ background: linear-gradient(90deg, #97d598 0.000%, #97d598 2.941%, #a8d385 calc(2.941% + 1px), #a8d385 5.882%, #b7ce71 calc(5.882% + 1px), #b7ce71 8.824%, #c4c55e calc(8.824% + 1px), #c4c55e 11.765%, #cdb84a calc(11.765% + 1px), #cdb84a 14.706%, #d3aa39 calc(14.706% + 1px), #d3aa39 17.647%, #d59829 calc(17.647% + 1px), #d59829 20.588%, #d4861b calc(20.588% + 1px), #d4861b 23.529%, #ce7210 calc(23.529% + 1px), #ce7210 26.471%, #c65f09 calc(26.471% + 1px), #c65f09 29.412%, #ba4b06 calc(29.412% + 1px), #ba4b06 32.353%, #ab3906 calc(32.353% + 1px), #ab3906 35.294%, #9a2909 calc(35.294% + 1px), #9a2909 38.235%, #871c11 calc(38.235% + 1px), #871c11 41.176%, #74111c calc(41.176% + 1px), #74111c 44.118%, #600929 calc(44.118% + 1px), #600929 47.059%, #4d063a calc(47.059% + 1px), #4d063a 50.000%, #3b064c calc(50.000% + 1px), #3b064c 52.941%, #2a095f calc(52.941% + 1px), #2a095f 55.882%, #1c1072 calc(55.882% + 1px), #1c1072 58.824%, #121b86 calc(58.824% + 1px), #121b86 61.765%, #0a2999 calc(61.765% + 1px), #0a2999 64.706%, #0639aa calc(64.706% + 1px), #0639aa 67.647%, #054bb9 calc(67.647% + 1px), #054bb9 70.588%, #095ec5 calc(70.588% + 1px), #095ec5 73.529%, #1072ce calc(73.529% + 1px), #1072ce 76.471%, #1a85d3 calc(76.471% + 1px), #1a85d3 79.412%, #2898d5 calc(79.412% + 1px), #2898d5 82.353%, #37a9d3 calc(82.353% + 1px), #37a9d3 85.294%, #49b8ce calc(85.294% + 1px), #49b8ce 88.235%, #5cc4c5 calc(88.235% + 1px), #5cc4c5 91.176%, #70cdb8 calc(91.176% + 1px), #70cdb8 94.118%, #84d3a9 calc(94.118% + 1px), #84d3a9 97.059%, #96d598 calc(97.059% + 1px) 100.000%);

["#97d598", "#a8d385", "#b7ce71", "#c4c55e", "#cdb84a", "#d3aa39", "#d59829", "#d4861b", "#ce7210", "#c65f09", "#ba4b06", "#ab3906", "#9a2909", "#871c11", "#74111c", "#600929", "#4d063a", "#3b064c", "#2a095f", "#1c1072", "#121b86", "#0a2999", "#0639aa", "#054bb9", "#095ec5", "#1072ce", "#1a85d3", "#2898d5", "#37a9d3", "#49b8ce", "#5cc4c5", "#70cdb8", "#84d3a9", "#96d598"]

// https://grabient.com/_f-ef-ef-egGYgGYgGYgPngPngPnf9IgAAgC3oOvovogA?style=linearSwatches&steps=34&angle=90 // cosine gradient palette — https://iquilezles.org/articles/palettes/ const float STEPS = 34.0; const float ANGLE = 90.0; vec3 palette(float t) { vec3 a = vec3(0.428, 0.428, 0.428); vec3 b = vec3(0.408, 0.408, 0.408); vec3 c = vec3(0.999, 0.999, 0.999); vec3 d = vec3(-0.184, 0.000, 0.183); 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 hospital green to rust to dark indigo to windows blue gradient palette editor

Rainbow hospital green to rust to dark indigo to windows blue