# Brown, gray and white linear gradient

Brown, gray and white linear gradient with 7 colors: #361404, #6b4a54, #aaa6b8, #e3eaf0, #eef2f4, #daddde, #c9cccd. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kSPSwgdoQtesBPa`
- Page: https://grabient.com/kSPSwgdoQtesBPa
- Drawn as: linear gradient, 7 steps, 90 degrees
- Kinds: light center, neutral, light
- Hues: wide
- Contrast of its darkest and lightest colors: 14.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 | `#361404` | `oklch(24.02% 0.0606 45.00)` | Chocolate Melange | white, 16.7 to 1 |
| 2 | `#6b4a54` | `oklch(44.88% 0.0462 359.36)` | Mixed Berry Jam | white, 7.6 to 1 |
| 3 | `#aaa6b8` | `oklch(73.45% 0.0263 296.35)` | Morning Mist Grey | black, 8.8 to 1 |
| 4 | `#e3eaf0` | `oklch(93.31% 0.0110 248.60)` | Himalaya Peaks | black, 17.2 to 1 |
| 5 | `#eef2f4` | `oklch(95.76% 0.0049 231.38)` | Maui Mist | black, 18.5 to 1 |
| 6 | `#daddde` | `oklch(89.50% 0.0034 229.42)` | Script White | black, 15.3 to 1 |
| 7 | `#c9cccd` | `oklch(84.25% 0.0028 229.58)` | Where There Is Smoke | black, 12.9 to 1 |

## CSS

```css
background: linear-gradient(90deg, #361404 0.0%, #6b4a54 16.7%, #aaa6b8 33.3%, #e3eaf0 50.0%, #eef2f4 66.7%, #daddde 83.3%, #c9cccd 100.0%);
background: linear-gradient(90deg in oklch, oklch(24.02% 0.0606 45.00) 0.0%, oklch(44.88% 0.0462 359.36) 16.7%, oklch(73.45% 0.0263 296.35) 33.3%, oklch(93.31% 0.0110 248.60) 50.0%, oklch(95.76% 0.0049 231.38) 66.7%, oklch(89.50% 0.0034 229.42) 83.3%, oklch(84.25% 0.0028 229.58) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.24 | 0.061 | 45 |
| 2 | 0.933 | 0.011 | -111.4 |
| 3 | 0.843 | 0.003 | -130.4 |

## In these collections

- [Silver gradients](https://grabient.com/silver-gradients)
- [Metallic gradients](https://grabient.com/metallic-gradients)

## Other forms

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