# Rainbow from orange to green linear swatches

Rainbow from orange to green linear swatches 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.

- Seed: `kWp4sfP0SwUa7Ppou6110jEA`
- Page: https://grabient.com/kWp4sfP0SwUa7Ppou6110jEA?style=linearSwatches&steps=40&angle=45
- Drawn as: linear swatches, 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.000% 2.500%, #eb5631 2.500% 5.000%, #e64b4f 5.000% 7.500%, #dd426c 7.500% 10.000%, #cd3e88 10.000% 12.500%, #b83ea1 12.500% 15.000%, #9f40b6 15.000% 17.500%, #8544c3 17.500% 20.000%, #6a49ca 20.000% 22.500%, #504ecc 22.500% 25.000%, #3b52cb 25.000% 27.500%, #2b55c8 27.500% 30.000%, #2656c7 30.000% 32.500%, #2956c5 32.500% 35.000%, #3157c5 35.000% 37.500%, #3a58c5 37.500% 40.000%, #415ac6 40.000% 42.500%, #455dc8 42.500% 45.000%, #4562cb 45.000% 47.500%, #3d6acf 47.500% 50.000%, #2475d2 50.000% 52.500%, #0084c8 52.500% 55.000%, #0094bb 55.000% 57.500%, #00a3b2 57.500% 60.000%, #00b2a6 60.000% 62.500%, #00c290 62.500% 65.000%, #61ca70 65.000% 67.500%, #97cc54 67.500% 70.000%, #bdcb3c 70.000% 72.500%, #d4c92c 72.500% 75.000%, #dfc71f 75.000% 77.500%, #e1c409 77.500% 80.000%, #dac200 80.000% 82.500%, #cdc000 82.500% 85.000%, #bcbe00 85.000% 87.500%, #a8bb00 87.500% 90.000%, #91b900 90.000% 92.500%, #78b800 92.500% 95.000%, #60b617 95.000% 97.500%, #50b521 97.500% 100.000%);
background: linear-gradient(45deg, oklch(65.75% 0.1915 43.59) 0.000% 2.500%, oklch(64.66% 0.1915 34.93) 2.500% 5.000%, oklch(63.11% 0.1915 23.04) 5.000% 7.500%, oklch(61.25% 0.1917 8.74) 7.500% 10.000%, oklch(59.18% 0.1918 352.85) 10.000% 12.500%, oklch(57.04% 0.1918 336.17) 12.500% 15.000%, oklch(54.94% 0.1917 319.54) 15.000% 17.500%, oklch(53.02% 0.1913 303.77) 17.500% 20.000%, oklch(51.38% 0.1907 289.68) 20.000% 22.500%, oklch(50.17% 0.1898 278.07) 22.500% 25.000%, oklch(49.48% 0.1884 269.78) 25.000% 27.500%, oklch(49.14% 0.1864 265.18) 27.500% 30.000%, oklch(49.04% 0.1838 263.56) 30.000% 32.500%, oklch(49.17% 0.1808 264.06) 32.500% 35.000%, oklch(49.53% 0.1775 265.84) 35.000% 37.500%, oklch(50.13% 0.1742 268.02) 37.500% 40.000%, oklch(50.94% 0.1709 269.75) 40.000% 42.500%, oklch(51.98% 0.1679 270.17) 42.500% 45.000%, oklch(53.23% 0.1653 268.43) 45.000% 47.500%, oklch(54.70% 0.1633 263.66) 47.500% 50.000%, oklch(56.45% 0.1620 254.96) 50.000% 52.500%, oklch(58.89% 0.1395 241.89) 52.500% 55.000%, oklch(61.89% 0.1177 225.37) 55.000% 57.500%, oklch(65.26% 0.1118 206.51) 57.500% 60.000%, oklch(68.80% 0.1204 186.41) 60.000% 62.500%, oklch(72.31% 0.1498 166.14) 62.500% 65.000%, oklch(75.59% 0.1599 146.80) 65.000% 67.500%, oklch(78.45% 0.1607 129.47) 67.500% 70.000%, oklch(80.68% 0.1619 115.25) 70.000% 72.500%, oklch(82.08% 0.1635 105.20) 72.500% 75.000%, oklch(82.51% 0.1657 99.99) 75.000% 77.500%, oklch(82.08% 0.1688 98.64) 77.500% 80.000%, oklch(80.95% 0.1685 100.40) 80.000% 82.500%, oklch(79.31% 0.1679 104.54) 82.500% 85.000%, oklch(77.33% 0.1692 110.33) 85.000% 87.500%, oklch(75.19% 0.1734 117.04) 87.500% 90.000%, oklch(73.06% 0.1812 123.93) 90.000% 92.500%, oklch(71.12% 0.1922 130.26) 92.500% 95.000%, oklch(69.54% 0.1974 135.31) 95.000% 97.500%, oklch(68.50% 0.1998 138.35) 97.500% 100.000%);
```

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