# Slate, Rust and Olive

Gray to brown linear gradient with 32 colors: #718992, #70898c, #718783, #75857a, #7a8173, #7e7d6e, #81796a, #847666, #887260, #8c6e59, #916953, #95654d, #986048, #9a5d45, #9c5a43, #9d5740, #9d553d, #9d543a, #9d5337, #9b5334, #985432, #945531, #905631, #8b5831, #875a31, #835d31, #806031, #7d6431, #786933, #746e36, #6f723a, #6c743e. Edit it and copy or download CSS, SVG, PNG or shader code.

- Also called: Gray to brown linear gradient
- Seed: `kYnBaeyYkvMUeu3Cpr_QJzC0ScRc`
- Page: https://grabient.com/kYnBaeyYkvMUeu3Cpr_QJzC0ScRc?steps=32&angle=180
- Drawn as: linear gradient, 32 steps, 180 degrees
- Kinds: even lightness, warm
- Hues: analogous
- Contrast of its darkest and lightest colors: 1.6 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 | `#718992` | `oklch(61.42% 0.0303 222.89)` | Lyric Blue | black, 5.6 to 1 |
| 2 | `#70898c` | `oklch(61.05% 0.0290 206.95)` | Twilight Stroll | black, 5.6 to 1 |
| 3 | `#718783` | `oklch(60.54% 0.0267 184.04)` | Echo Park | black, 5.5 to 1 |
| 4 | `#75857a` | `oklch(59.93% 0.0241 157.24)` | Limerick | black, 5.3 to 1 |
| 5 | `#7a8173` | `oklch(59.28% 0.0222 129.64)` | Harbour Mist Grey | black, 5.2 to 1 |
| 6 | `#7e7d6e` | `oklch(58.61% 0.0219 104.31)` | Vetiver | black, 5 to 1 |
| 7 | `#81796a` | `oklch(57.99% 0.0240 84.36)` | Rogue | black, 4.8 to 1 |
| 8 | `#847666` | `oklch(57.41% 0.0295 71.04)` | Dune Shadow | black, 4.7 to 1 |
| 9 | `#887260` | `oklch(56.80% 0.0384 61.56)` | Cloudy Cinnamon | black, 4.6 to 1 |
| 10 | `#8c6e59` | `oklch(56.19% 0.0492 55.00)` | Dig It | white, 4.6 to 1 |
| 11 | `#916953` | `oklch(55.59% 0.0608 50.52)` | Leather | white, 4.8 to 1 |
| 12 | `#95654d` | `oklch(55.02% 0.0719 47.29)` | Rustic Earth | white, 4.9 to 1 |
| 13 | `#986048` | `oklch(54.51% 0.0812 44.45)` | Vintage Copper | white, 5.1 to 1 |
| 14 | `#9a5d45` | `oklch(54.08% 0.0879 41.57)` | Vintage Copper | white, 5.2 to 1 |
| 15 | `#9c5a43` | `oklch(53.70% 0.0936 39.72)` | Chocolate Fountain | white, 5.3 to 1 |
| 16 | `#9d5740` | `oklch(53.37% 0.0985 38.89)` | Ceramic Brown | white, 5.4 to 1 |
| 17 | `#9d553d` | `oklch(53.08% 0.1023 38.95)` | Ancient Copper | white, 5.4 to 1 |
| 18 | `#9d543a` | `oklch(52.80% 0.1049 39.74)` | Ancient Copper | white, 5.5 to 1 |
| 19 | `#9d5337` | `oklch(52.53% 0.1061 41.13)` | Taisha Red | white, 5.6 to 1 |
| 20 | `#9b5334` | `oklch(52.24% 0.1057 42.99)` | Piper | white, 5.6 to 1 |
| 21 | `#985432` | `oklch(51.89% 0.1027 45.46)` | Hello Fall | white, 5.7 to 1 |
| 22 | `#945531` | `oklch(51.51% 0.0978 48.59)` | Chelsea Gem | white, 5.8 to 1 |
| 23 | `#905631` | `oklch(51.16% 0.0920 52.37)` | Chestnut Chest | white, 5.8 to 1 |
| 24 | `#8b5831` | `oklch(50.89% 0.0861 56.82)` | Brushwood | white, 5.9 to 1 |
| 25 | `#875a31` | `oklch(50.76% 0.0812 61.93)` | Treacle | white, 5.9 to 1 |
| 26 | `#835d31` | `oklch(50.82% 0.0781 67.74)` | Bronze Brown | white, 5.8 to 1 |
| 27 | `#806031` | `oklch(51.15% 0.0766 75.26)` | Bronze Brown | white, 5.7 to 1 |
| 28 | `#7d6431` | `oklch(51.68% 0.0761 84.26)` | Dirt Brown | white, 5.6 to 1 |
| 29 | `#786933` | `oklch(52.33% 0.0762 93.79)` | Racoon Eyes | white, 5.4 to 1 |
| 30 | `#746e36` | `oklch(52.99% 0.0766 102.92)` | Tuscan Hills | white, 5.2 to 1 |
| 31 | `#6f723a` | `oklch(53.56% 0.0770 110.69)` | Relentless Olive | white, 5 to 1 |
| 32 | `#6c743e` | `oklch(53.94% 0.0772 116.16)` | Cedar Green | white, 4.9 to 1 |

## CSS

```css
background: linear-gradient(180deg, #718992 0.0%, #70898c 3.2%, #718783 6.5%, #75857a 9.7%, #7a8173 12.9%, #7e7d6e 16.1%, #81796a 19.4%, #847666 22.6%, #887260 25.8%, #8c6e59 29.0%, #916953 32.3%, #95654d 35.5%, #986048 38.7%, #9a5d45 41.9%, #9c5a43 45.2%, #9d5740 48.4%, #9d553d 51.6%, #9d543a 54.8%, #9d5337 58.1%, #9b5334 61.3%, #985432 64.5%, #945531 67.7%, #905631 71.0%, #8b5831 74.2%, #875a31 77.4%, #835d31 80.6%, #806031 83.9%, #7d6431 87.1%, #786933 90.3%, #746e36 93.5%, #6f723a 96.8%, #6c743e 100.0%);
background: linear-gradient(180deg in oklch, oklch(61.42% 0.0303 222.89) 0.0%, oklch(61.05% 0.0290 206.95) 3.2%, oklch(60.54% 0.0267 184.04) 6.5%, oklch(59.93% 0.0241 157.24) 9.7%, oklch(59.28% 0.0222 129.64) 12.9%, oklch(58.61% 0.0219 104.31) 16.1%, oklch(57.99% 0.0240 84.36) 19.4%, oklch(57.41% 0.0295 71.04) 22.6%, oklch(56.80% 0.0384 61.56) 25.8%, oklch(56.19% 0.0492 55.00) 29.0%, oklch(55.59% 0.0608 50.52) 32.3%, oklch(55.02% 0.0719 47.29) 35.5%, oklch(54.51% 0.0812 44.45) 38.7%, oklch(54.08% 0.0879 41.57) 41.9%, oklch(53.70% 0.0936 39.72) 45.2%, oklch(53.37% 0.0985 38.89) 48.4%, oklch(53.08% 0.1023 38.95) 51.6%, oklch(52.80% 0.1049 39.74) 54.8%, oklch(52.53% 0.1061 41.13) 58.1%, oklch(52.24% 0.1057 42.99) 61.3%, oklch(51.89% 0.1027 45.46) 64.5%, oklch(51.51% 0.0978 48.59) 67.7%, oklch(51.16% 0.0920 52.37) 71.0%, oklch(50.89% 0.0861 56.82) 74.2%, oklch(50.76% 0.0812 61.93) 77.4%, oklch(50.82% 0.0781 67.74) 80.6%, oklch(51.15% 0.0766 75.26) 83.9%, oklch(51.68% 0.0761 84.26) 87.1%, oklch(52.33% 0.0762 93.79) 90.3%, oklch(52.99% 0.0766 102.92) 93.5%, oklch(53.56% 0.0770 110.69) 96.8%, oklch(53.94% 0.0772 116.16) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.614 | 0.03 | 222.9 |
| 2 | 0.579 | 0.025 | 81.3 |
| 3 | 0.543 | 0.084 | 43.2 |
| 4 | 0.524 | 0.106 | 42.2 |
| 5 | 0.508 | 0.079 | 66.5 |
| 6 | 0.539 | 0.077 | 116.2 |

## In these collections

- [Burnished beech canopy](https://grabient.com/burnished-beech-canopy)

## Other forms

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