# Rainbow from brown to green linear gradient

Rainbow from brown to green linear gradient with 34 colors: #74783e, #7f7334, #8e6a2b, #9c5f31, #a65542, #ab4e53, #b24962, #b84470, #be407e, #c13d8c, #bf3b9b, #bc3ba8, #b73bb2, #af3ebc, #a545c4, #994fc6, #8c59c0, #7f63b6, #736bae, #6673aa, #537da9, #3889a3, #239492, #339b7b, #47a068, #4ba658, #43ae4c, #2fb544, #1bbb3d, #2dbc34, #40bb34, #4fb939, #5ab73f, #60b643. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kcjTpQRSs1UlFO3IyLySCA7NApshYTD5WL6_I`
- Page: https://grabient.com/kcjTpQRSs1UlFO3IyLySCA7NApshYTD5WL6_I?steps=34&angle=45
- Drawn as: linear gradient, 34 steps, 45 degrees
- Kinds: vivid, rainbow
- Hues: complementary
- Contrast of its darkest and lightest colors: 2.1 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 | `#74783e` | `oklch(55.51% 0.0799 112.50)` | Jungle Look | white, 4.6 to 1 |
| 2 | `#7f7334` | `oklch(55.26% 0.0850 98.44)` | Spanish Bistre | white, 4.7 to 1 |
| 3 | `#8e6a2b` | `oklch(54.87% 0.0919 78.03)` | Armageddon Dunes | white, 4.9 to 1 |
| 4 | `#9c5f31` | `oklch(54.49% 0.1004 55.31)` | Gingerbread Crumble | white, 5.1 to 1 |
| 5 | `#a65542` | `oklch(54.28% 0.1105 34.34)` | Portsmouth Spice | white, 5.2 to 1 |
| 6 | `#ab4e53` | `oklch(54.41% 0.1221 18.97)` | Young Redwood | white, 5.2 to 1 |
| 7 | `#b24962` | `oklch(54.97% 0.1373 8.31)` | Gala Pink | white, 5.2 to 1 |
| 8 | `#b84470` | `oklch(55.79% 0.1549 0.32)` | Valentino | white, 5.1 to 1 |
| 9 | `#be407e` | `oklch(56.65% 0.1719 353.80)` | Razzle Dazzle | white, 4.9 to 1 |
| 10 | `#c13d8c` | `oklch(57.31% 0.1858 347.54)` | Boat Orchid | white, 4.8 to 1 |
| 11 | `#bf3b9b` | `oklch(57.60% 0.1950 340.80)` | Byzantine | white, 4.8 to 1 |
| 12 | `#bc3ba8` | `oklch(57.61% 0.2025 334.85)` | Byzantine | white, 4.8 to 1 |
| 13 | `#b73bb2` | `oklch(57.47% 0.2071 329.32)` | Vivid Fuchsia | white, 4.9 to 1 |
| 14 | `#af3ebc` | `oklch(57.26% 0.2073 323.61)` | Vivid Fuchsia | white, 4.9 to 1 |
| 15 | `#a545c4` | `oklch(57.10% 0.2013 317.13)` | Fuchsia Pheromone | white, 4.9 to 1 |
| 16 | `#994fc6` | `oklch(56.92% 0.1850 310.55)` | Morado Purple | white, 4.9 to 1 |
| 17 | `#8c59c0` | `oklch(56.62% 0.1581 304.75)` | Lusty Lavender | white, 4.8 to 1 |
| 18 | `#7f63b6` | `oklch(56.36% 0.1279 297.89)` | Lavish Spending | white, 4.8 to 1 |
| 19 | `#736bae` | `oklch(56.36% 0.1017 288.10)` | Clear Mauve | white, 4.7 to 1 |
| 20 | `#6673aa` | `oklch(56.79% 0.0870 273.44)` | King’s Robe | black, 4.5 to 1 |
| 21 | `#537da9` | `oklch(57.75% 0.0834 250.57)` | Aleutian Isle | black, 4.8 to 1 |
| 22 | `#3889a3` | `oklch(59.10% 0.0869 222.01)` | Magic Blue | black, 5.2 to 1 |
| 23 | `#239492` | `oklch(60.64% 0.0954 192.93)` | Atrovirens | black, 5.7 to 1 |
| 24 | `#339b7b` | `oklch(62.19% 0.1071 168.51)` | Dancing Jewel | black, 6.1 to 1 |
| 25 | `#47a068` | `oklch(63.59% 0.1209 153.48)` | Greenish | black, 6.4 to 1 |
| 26 | `#4ba658` | `oklch(65.09% 0.1423 146.62)` | Straightforward Green | black, 6.9 to 1 |
| 27 | `#43ae4c` | `oklch(66.62% 0.1677 144.82)` | Matt Green | black, 7.3 to 1 |
| 28 | `#2fb544` | `oklch(68.00% 0.1912 145.32)` | Try Your Luck | black, 7.8 to 1 |
| 29 | `#1bbb3d` | `oklch(69.07% 0.2071 145.36)` | Charming Nature | black, 8.2 to 1 |
| 30 | `#2dbc34` | `oklch(69.68% 0.2107 143.48)` | Green With Envy | black, 8.3 to 1 |
| 31 | `#40bb34` | `oklch(69.89% 0.2041 141.79)` | Green With Envy | black, 8.4 to 1 |
| 32 | `#4fb939` | `oklch(69.85% 0.1923 140.43)` | Skirret Green | black, 8.3 to 1 |
| 33 | `#5ab73f` | `oklch(69.73% 0.1800 139.36)` | Skirret Green | black, 8.2 to 1 |
| 34 | `#60b643` | `oklch(69.69% 0.1722 138.57)` | Sour Candy | black, 8.2 to 1 |

## CSS

```css
background: linear-gradient(45deg, #74783e 0.0%, #7f7334 3.0%, #8e6a2b 6.1%, #9c5f31 9.1%, #a65542 12.1%, #ab4e53 15.2%, #b24962 18.2%, #b84470 21.2%, #be407e 24.2%, #c13d8c 27.3%, #bf3b9b 30.3%, #bc3ba8 33.3%, #b73bb2 36.4%, #af3ebc 39.4%, #a545c4 42.4%, #994fc6 45.5%, #8c59c0 48.5%, #7f63b6 51.5%, #736bae 54.5%, #6673aa 57.6%, #537da9 60.6%, #3889a3 63.6%, #239492 66.7%, #339b7b 69.7%, #47a068 72.7%, #4ba658 75.8%, #43ae4c 78.8%, #2fb544 81.8%, #1bbb3d 84.8%, #2dbc34 87.9%, #40bb34 90.9%, #4fb939 93.9%, #5ab73f 97.0%, #60b643 100.0%);
background: linear-gradient(45deg in oklch, oklch(55.51% 0.0799 112.50) 0.0%, oklch(55.26% 0.0850 98.44) 3.0%, oklch(54.87% 0.0919 78.03) 6.1%, oklch(54.49% 0.1004 55.31) 9.1%, oklch(54.28% 0.1105 34.34) 12.1%, oklch(54.41% 0.1221 18.97) 15.2%, oklch(54.97% 0.1373 8.31) 18.2%, oklch(55.79% 0.1549 0.32) 21.2%, oklch(56.65% 0.1719 353.80) 24.2%, oklch(57.31% 0.1858 347.54) 27.3%, oklch(57.60% 0.1950 340.80) 30.3%, oklch(57.61% 0.2025 334.85) 33.3%, oklch(57.47% 0.2071 329.32) 36.4%, oklch(57.26% 0.2073 323.61) 39.4%, oklch(57.10% 0.2013 317.13) 42.4%, oklch(56.92% 0.1850 310.55) 45.5%, oklch(56.62% 0.1581 304.75) 48.5%, oklch(56.36% 0.1279 297.89) 51.5%, oklch(56.36% 0.1017 288.10) 54.5%, oklch(56.79% 0.0870 273.44) 57.6%, oklch(57.75% 0.0834 250.57) 60.6%, oklch(59.10% 0.0869 222.01) 63.6%, oklch(60.64% 0.0954 192.93) 66.7%, oklch(62.19% 0.1071 168.51) 69.7%, oklch(63.59% 0.1209 153.48) 72.7%, oklch(65.09% 0.1423 146.62) 75.8%, oklch(66.62% 0.1677 144.82) 78.8%, oklch(68.00% 0.1912 145.32) 81.8%, oklch(69.07% 0.2071 145.36) 84.8%, oklch(69.68% 0.2107 143.48) 87.9%, oklch(69.89% 0.2041 141.79) 90.9%, oklch(69.85% 0.1923 140.43) 93.9%, oklch(69.73% 0.1800 139.36) 97.0%, oklch(69.69% 0.1722 138.57) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.555 | 0.08 | 112.5 |
| 2 | 0.543 | 0.119 | 22.7 |
| 3 | 0.575 | 0.19 | -15.4 |
| 4 | 0.571 | 0.2 | -43.9 |
| 5 | 0.567 | 0.088 | -84.1 |
| 6 | 0.63 | 0.114 | -201.4 |
| 7 | 0.693 | 0.209 | -215.1 |
| 8 | 0.697 | 0.172 | -221.4 |

## In these collections

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

## Other forms

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