# Gray, olive, tan and brown linear gradient

Gray, olive, tan and brown linear gradient with 7 colors: #d4d6c4, #777c58, #6c6735, #b29363, #ad7651, #85483b, #522024. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kW3RJPu5e_9abO_GILvKJs84`
- Page: https://grabient.com/kW3RJPu5e_9abO_GILvKJs84
- Drawn as: linear gradient, 7 steps, 90 degrees
- Kinds: warm
- Hues: wide
- Contrast of its darkest and lightest colors: 8.9 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 | `#d4d6c4` | `oklch(87.01% 0.0248 111.80)` | Wine Bottle | black, 14.2 to 1 |
| 2 | `#777c58` | `oklch(57.17% 0.0522 114.30)` | Variegated Frond | black, 4.7 to 1 |
| 3 | `#6c6735` | `oklch(50.66% 0.0700 103.07)` | Jungle Civilization | white, 5.7 to 1 |
| 4 | `#b29363` | `oklch(68.11% 0.0744 77.98)` | Gold Ransom | black, 7.2 to 1 |
| 5 | `#ad7651` | `oklch(61.48% 0.0866 54.07)` | Brown Sugar | black, 5.4 to 1 |
| 6 | `#85483b` | `oklch(47.27% 0.0862 33.01)` | Sequoia | white, 7 to 1 |
| 7 | `#522024` | `oklch(31.89% 0.0744 17.75)` | Lonestar | white, 13.1 to 1 |

## CSS

```css
background: linear-gradient(90deg, #d4d6c4 0.0%, #777c58 16.7%, #6c6735 33.3%, #b29363 50.0%, #ad7651 66.7%, #85483b 83.3%, #522024 100.0%);
background: linear-gradient(90deg in oklch, oklch(87.01% 0.0248 111.80) 0.0%, oklch(57.17% 0.0522 114.30) 16.7%, oklch(50.66% 0.0700 103.07) 33.3%, oklch(68.11% 0.0744 77.98) 50.0%, oklch(61.48% 0.0866 54.07) 66.7%, oklch(47.27% 0.0862 33.01) 83.3%, oklch(31.89% 0.0744 17.75) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.87 | 0.025 | 111.8 |
| 2 | 0.469 | 0.065 | 111.8 |
| 3 | 0.681 | 0.074 | 78 |
| 4 | 0.551 | 0.09 | 43.1 |
| 5 | 0.319 | 0.074 | 17.7 |

## In these collections

- [Fall swatches](https://grabient.com/fall-swatches)

## Other forms

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