# Gray, green and brown linear gradient

Gray, green and brown linear gradient with 7 colors: #c6cdc1, #9ab187, #6c9457, #3e7841, #004b31, #1b2900, #2e1201. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kW1Q1eVR8_8ImQWmG0FnBQzY`
- Page: https://grabient.com/kW1Q1eVR8_8ImQWmG0FnBQzY
- Drawn as: linear gradient, 7 steps, 90 degrees
- Kinds: light to dark
- Hues: analogous
- Contrast of its darkest and lightest colors: 10.7 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 | `#c6cdc1` | `oklch(83.86% 0.0179 132.19)` | Silver Grass | black, 12.8 to 1 |
| 2 | `#9ab187` | `oklch(73.05% 0.0640 131.25)` | Easygoing Green | black, 8.9 to 1 |
| 3 | `#6c9457` | `oklch(62.06% 0.0973 135.48)` | Drab Green | black, 5.9 to 1 |
| 4 | `#3e7841` | `oklch(51.97% 0.1047 144.87)` | Cucumber Queen | white, 5.2 to 1 |
| 5 | `#004b31` | `oklch(36.49% 0.0800 162.05)` | Troll Green | white, 10.2 to 1 |
| 6 | `#1b2900` | `oklch(25.96% 0.0664 127.18)` | Lindworm Green | white, 15.3 to 1 |
| 7 | `#2e1201` | `oklch(22.05% 0.0551 51.87)` | Shadow Play | white, 17.4 to 1 |

## CSS

```css
background: linear-gradient(90deg, #c6cdc1 0.0%, #9ab187 16.7%, #6c9457 33.3%, #3e7841 50.0%, #004b31 66.7%, #1b2900 83.3%, #2e1201 100.0%);
background: linear-gradient(90deg in oklch, oklch(83.86% 0.0179 132.19) 0.0%, oklch(73.05% 0.0640 131.25) 16.7%, oklch(62.06% 0.0973 135.48) 33.3%, oklch(51.97% 0.1047 144.87) 50.0%, oklch(36.49% 0.0800 162.05) 66.7%, oklch(25.96% 0.0664 127.18) 83.3%, oklch(22.05% 0.0551 51.87) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.839 | 0.018 | 132.2 |
| 2 | 0.669 | 0.085 | 132.2 |
| 3 | 0.52 | 0.105 | 144.9 |
| 4 | 0.299 | 0.074 | 157.5 |
| 5 | 0.22 | 0.055 | 51.9 |

## In these collections

- [Forest swatches](https://grabient.com/forest-swatches)

## Other forms

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