# Blue green red spectrum

Rainbow from orange to green linear gradient with 40 colors: #ec5f04, #eb5631, #e64b4f, #dd426c, #cd3e88, #b83ea1, #9f40b6, #8544c3, #6a49ca, #504ecc, #3b52cb, #2b55c8, #2656c7, #2956c5, #3157c5, #3a58c5, #415ac6, #455dc8, #4562cb, #3d6acf, #2475d2, #0084c8, #0094bb, #00a3b2, #00b2a6, #00c290, #61ca70, #97cc54, #bdcb3c, #d4c92c, #dfc71f, #e1c409, #dac200, #cdc000, #bcbe00, #a8bb00, #91b900, #78b800, #60b617, #50b521. Edit it and copy or download CSS, SVG, PNG or shader code.

- Also called: Rainbow from orange to green linear gradient
- Seed: `kWp4sfP0SwUa7Ppou6110jEA`
- Page: https://grabient.com/kWp4sfP0SwUa7Ppou6110jEA?steps=40&angle=45
- Drawn as: linear gradient, 40 steps, 45 degrees
- Kinds: vivid, rainbow
- Hues: triadic
- Contrast of its darkest and lightest colors: 3.8 to 1

## Colors

The name most people give each color, and the text color that reads on it with its contrast.

| Stop | Hex | OKLCH | Name | Text on it |
| --- | --- | --- | --- | --- |
| 1 | `#ec5f04` | `oklch(65.75% 0.1915 43.59)` | Shu Red | black, 6.1 to 1 |
| 2 | `#eb5631` | `oklch(64.66% 0.1915 34.93)` | Fuego | black, 5.8 to 1 |
| 3 | `#e64b4f` | `oklch(63.11% 0.1915 23.04)` | Thimbleberry | black, 5.4 to 1 |
| 4 | `#dd426c` | `oklch(61.25% 0.1917 8.74)` | Rouge Red | black, 5 to 1 |
| 5 | `#cd3e88` | `oklch(59.18% 0.1918 352.85)` | Smitten | black, 4.6 to 1 |
| 6 | `#b83ea1` | `oklch(57.04% 0.1918 336.17)` | Ultraviolet Nusp | white, 4.9 to 1 |
| 7 | `#9f40b6` | `oklch(54.94% 0.1917 319.54)` | Akebi Purple | white, 5.3 to 1 |
| 8 | `#8544c3` | `oklch(53.02% 0.1913 303.77)` | Harley Hair Purple | white, 5.8 to 1 |
| 9 | `#6a49ca` | `oklch(51.38% 0.1907 289.68)` | Waiporoporo Purple | white, 6.1 to 1 |
| 10 | `#504ecc` | `oklch(50.17% 0.1898 278.07)` | Iris | white, 6.3 to 1 |
| 11 | `#3b52cb` | `oklch(49.48% 0.1884 269.78)` | Gorgonzola Blue | white, 6.4 to 1 |
| 12 | `#2b55c8` | `oklch(49.14% 0.1864 265.18)` | Cerulean Blue | white, 6.5 to 1 |
| 13 | `#2656c7` | `oklch(49.04% 0.1838 263.56)` | Cerulean Blue | white, 6.5 to 1 |
| 14 | `#2956c5` | `oklch(49.17% 0.1808 264.06)` | Cerulean Blue | white, 6.4 to 1 |
| 15 | `#3157c5` | `oklch(49.53% 0.1775 265.84)` | Free Speech Blue | white, 6.3 to 1 |
| 16 | `#3a58c5` | `oklch(50.13% 0.1742 268.02)` | Free Speech Blue | white, 6.2 to 1 |
| 17 | `#415ac6` | `oklch(50.94% 0.1709 269.75)` | Free Speech Blue | white, 6 to 1 |
| 18 | `#455dc8` | `oklch(51.98% 0.1679 270.17)` | Savoy Blue | white, 5.7 to 1 |
| 19 | `#4562cb` | `oklch(53.23% 0.1653 268.43)` | God of Rain | white, 5.4 to 1 |
| 20 | `#3d6acf` | `oklch(54.70% 0.1633 263.66)` | Han Blue | white, 5 to 1 |
| 21 | `#2475d2` | `oklch(56.45% 0.1620 254.96)` | Bright Navy Blue | white, 4.6 to 1 |
| 22 | `#0084c8` | `oklch(58.89% 0.1395 241.89)` | Water Raceway | black, 5.1 to 1 |
| 23 | `#0094bb` | `oklch(61.89% 0.1177 225.37)` | Blue Danube | black, 5.9 to 1 |
| 24 | `#00a3b2` | `oklch(65.26% 0.1118 206.51)` | Garish Blue | black, 6.8 to 1 |
| 25 | `#00b2a6` | `oklch(68.80% 0.1204 186.41)` | Cozumel | black, 7.9 to 1 |
| 26 | `#00c290` | `oklch(72.31% 0.1498 166.14)` | Blarney | black, 9.1 to 1 |
| 27 | `#61ca70` | `oklch(75.59% 0.1599 146.80)` | Verdant Oasis | black, 10.2 to 1 |
| 28 | `#97cc54` | `oklch(78.45% 0.1607 129.47)` | Wicked Green | black, 11.1 to 1 |
| 29 | `#bdcb3c` | `oklch(80.68% 0.1619 115.25)` | Grunervetliner | black, 11.8 to 1 |
| 30 | `#d4c92c` | `oklch(82.08% 0.1635 105.20)` | LED Green | black, 12.2 to 1 |
| 31 | `#dfc71f` | `oklch(82.51% 0.1657 99.99)` | Paella | black, 12.3 to 1 |
| 32 | `#e1c409` | `oklch(82.08% 0.1688 98.64)` | Zhohltyi Yellow | black, 12.1 to 1 |
| 33 | `#dac200` | `oklch(80.95% 0.1685 100.40)` | Sorbet Yellow | black, 11.7 to 1 |
| 34 | `#cdc000` | `oklch(79.31% 0.1679 104.54)` | Banana Powder | black, 11.1 to 1 |
| 35 | `#bcbe00` | `oklch(77.33% 0.1692 110.33)` | La Rioja | black, 10.4 to 1 |
| 36 | `#a8bb00` | `oklch(75.19% 0.1734 117.04)` | Dark Citron | black, 9.7 to 1 |
| 37 | `#91b900` | `oklch(73.06% 0.1812 123.93)` | Seasoned Green | black, 9.1 to 1 |
| 38 | `#78b800` | `oklch(71.12% 0.1922 130.26)` | Green Serpent | black, 8.6 to 1 |
| 39 | `#60b617` | `oklch(69.54% 0.1974 135.31)` | Chasm Green | black, 8.2 to 1 |
| 40 | `#50b521` | `oklch(68.50% 0.1998 138.35)` | Kermit Green | black, 7.9 to 1 |

## CSS

```css
background: linear-gradient(45deg, #ec5f04 0.0%, #eb5631 2.6%, #e64b4f 5.1%, #dd426c 7.7%, #cd3e88 10.3%, #b83ea1 12.8%, #9f40b6 15.4%, #8544c3 17.9%, #6a49ca 20.5%, #504ecc 23.1%, #3b52cb 25.6%, #2b55c8 28.2%, #2656c7 30.8%, #2956c5 33.3%, #3157c5 35.9%, #3a58c5 38.5%, #415ac6 41.0%, #455dc8 43.6%, #4562cb 46.2%, #3d6acf 48.7%, #2475d2 51.3%, #0084c8 53.8%, #0094bb 56.4%, #00a3b2 59.0%, #00b2a6 61.5%, #00c290 64.1%, #61ca70 66.7%, #97cc54 69.2%, #bdcb3c 71.8%, #d4c92c 74.4%, #dfc71f 76.9%, #e1c409 79.5%, #dac200 82.1%, #cdc000 84.6%, #bcbe00 87.2%, #a8bb00 89.7%, #91b900 92.3%, #78b800 94.9%, #60b617 97.4%, #50b521 100.0%);
background: linear-gradient(45deg in oklch, oklch(65.75% 0.1915 43.59) 0.0%, oklch(64.66% 0.1915 34.93) 2.6%, oklch(63.11% 0.1915 23.04) 5.1%, oklch(61.25% 0.1917 8.74) 7.7%, oklch(59.18% 0.1918 352.85) 10.3%, oklch(57.04% 0.1918 336.17) 12.8%, oklch(54.94% 0.1917 319.54) 15.4%, oklch(53.02% 0.1913 303.77) 17.9%, oklch(51.38% 0.1907 289.68) 20.5%, oklch(50.17% 0.1898 278.07) 23.1%, oklch(49.48% 0.1884 269.78) 25.6%, oklch(49.14% 0.1864 265.18) 28.2%, oklch(49.04% 0.1838 263.56) 30.8%, oklch(49.17% 0.1808 264.06) 33.3%, oklch(49.53% 0.1775 265.84) 35.9%, oklch(50.13% 0.1742 268.02) 38.5%, oklch(50.94% 0.1709 269.75) 41.0%, oklch(51.98% 0.1679 270.17) 43.6%, oklch(53.23% 0.1653 268.43) 46.2%, oklch(54.70% 0.1633 263.66) 48.7%, oklch(56.45% 0.1620 254.96) 51.3%, oklch(58.89% 0.1395 241.89) 53.8%, oklch(61.89% 0.1177 225.37) 56.4%, oklch(65.26% 0.1118 206.51) 59.0%, oklch(68.80% 0.1204 186.41) 61.5%, oklch(72.31% 0.1498 166.14) 64.1%, oklch(75.59% 0.1599 146.80) 66.7%, oklch(78.45% 0.1607 129.47) 69.2%, oklch(80.68% 0.1619 115.25) 71.8%, oklch(82.08% 0.1635 105.20) 74.4%, oklch(82.51% 0.1657 99.99) 76.9%, oklch(82.08% 0.1688 98.64) 79.5%, oklch(80.95% 0.1685 100.40) 82.1%, oklch(79.31% 0.1679 104.54) 84.6%, oklch(77.33% 0.1692 110.33) 87.2%, oklch(75.19% 0.1734 117.04) 89.7%, oklch(73.06% 0.1812 123.93) 92.3%, oklch(71.12% 0.1922 130.26) 94.9%, oklch(69.54% 0.1974 135.31) 97.4%, oklch(68.50% 0.1998 138.35) 100.0%);
```

## Keyframes

5 OKLCH keyframes joined by a Catmull-Rom spline. Hue is unwrapped degrees.

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.657 | 0.192 | 43.6 |
| 2 | 0.496 | 0.189 | -88.5 |
| 3 | 0.555 | 0.163 | -100.1 |
| 4 | 0.823 | 0.164 | -256.5 |
| 5 | 0.685 | 0.2 | -221.7 |

## In these collections

- [Rainbow gradients](https://grabient.com/rainbow-gradients)

## Other forms

- [JSON](https://grabient.com/kWp4sfP0SwUa7Ppou6110jEA.json?steps=40&angle=45)
- [PNG](https://grabient.com/kWp4sfP0SwUa7Ppou6110jEA.png?steps=40&angle=45)
- [SVG](https://grabient.com/kWp4sfP0SwUa7Ppou6110jEA.svg?steps=40&angle=45)
- [CSS](https://grabient.com/kWp4sfP0SwUa7Ppou6110jEA.css?steps=40&angle=45)
- [ASE](https://grabient.com/kWp4sfP0SwUa7Ppou6110jEA.ase?steps=40&angle=45)
- [GPL](https://grabient.com/kWp4sfP0SwUa7Ppou6110jEA.gpl?steps=40&angle=45)
- [GRD](https://grabient.com/kWp4sfP0SwUa7Ppou6110jEA.grd?steps=40&angle=45)
- [Design tokens](https://grabient.com/kWp4sfP0SwUa7Ppou6110jEA.tokens.json?steps=40&angle=45)
- [Social card](https://grabient.com/api/og?seed=kWp4sfP0SwUa7Ppou6110jEA&steps=40&angle=45)
- [Palettes like this one](https://grabient.com/palettes?q=kWp4sfP0SwUa7Ppou6110jEA)
- [Guide for agents](https://grabient.com/llms.txt)