# Monochrome gray to brown linear gradient

Monochrome gray to brown linear gradient with 7 colors: #e3dbcd, #a18f7a, #6d5239, #89725c, #b39e8a, #b2866d, #a76051. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kU4w86OpM91qNwFIIrvg`
- Page: https://grabient.com/kU4w86OpM91qNwFIIrvg
- Drawn as: linear gradient, 7 steps, 90 degrees
- Kinds: dark center, muted, warm, monochrome
- Hues: analogous
- Contrast of its darkest and lightest colors: 5.2 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 | `#e3dbcd` | `oklch(89.37% 0.0207 81.56)` | Last Straw | black, 15.2 to 1 |
| 2 | `#a18f7a` | `oklch(66.14% 0.0375 72.38)` | Sandy Ridge | black, 6.7 to 1 |
| 3 | `#6d5239` | `oklch(46.06% 0.0524 63.60)` | Coffee Liqueur | white, 7.1 to 1 |
| 4 | `#89725c` | `oklch(56.87% 0.0431 66.17)` | Sweet Georgia Brown | black, 4.6 to 1 |
| 5 | `#b39e8a` | `oklch(71.26% 0.0372 66.77)` | Easily Suede | black, 8.1 to 1 |
| 6 | `#b2866d` | `oklch(65.55% 0.0652 50.06)` | Renwick Rose Beige | black, 6.5 to 1 |
| 7 | `#a76051` | `oklch(56.69% 0.0951 32.95)` | Roycroft Adobe | white, 4.7 to 1 |

## CSS

```css
background: linear-gradient(90deg, #e3dbcd 0.0%, #a18f7a 16.7%, #6d5239 33.3%, #89725c 50.0%, #b39e8a 66.7%, #b2866d 83.3%, #a76051 100.0%);
background: linear-gradient(90deg in oklch, oklch(89.37% 0.0207 81.56) 0.0%, oklch(66.14% 0.0375 72.38) 16.7%, oklch(46.06% 0.0524 63.60) 33.3%, oklch(56.87% 0.0431 66.17) 50.0%, oklch(71.26% 0.0372 66.77) 66.7%, oklch(65.55% 0.0652 50.06) 83.3%, oklch(56.69% 0.0951 32.95) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.894 | 0.021 | 81.6 |
| 2 | 0.461 | 0.052 | 63.6 |
| 3 | 0.713 | 0.037 | 66.8 |
| 4 | 0.567 | 0.095 | 33 |

## Other forms

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