# Gray to brown linear gradient

Gray to brown linear gradient with 32 colors: #cdc3b8, #ccc2b6, #cac0b4, #c9bdb1, #c7bbaf, #c5b8ac, #c3b5a9, #c1b2a6, #beaea2, #bcab9f, #baa89c, #b7a499, #b5a196, #b39e93, #b19b90, #af988d, #ad958b, #ab9389, #a99086, #a78d84, #a58a81, #a3877f, #a1857d, #9f827a, #9d7f78, #9b7d76, #9a7b74, #987872, #967771, #95756f, #94736e, #93726d. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kS0Q402Au8koPve`
- Page: https://grabient.com/kS0Q402Au8koPve?steps=32&angle=180
- Drawn as: linear gradient, 32 steps, 180 degrees
- Kinds: neutral, warm
- Hues: monochromatic
- Contrast of its darkest and lightest colors: 2.4 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 | `#cdc3b8` | `oklch(82.28% 0.0193 73.83)` | Doeskin Grey | black, 12.1 to 1 |
| 2 | `#ccc2b6` | `oklch(81.81% 0.0197 72.77)` | Whippet | black, 11.9 to 1 |
| 3 | `#cac0b4` | `oklch(81.23% 0.0203 71.46)` | Loophole | black, 11.6 to 1 |
| 4 | `#c9bdb1` | `oklch(80.56% 0.0209 69.93)` | Raw Cashew Nut | black, 11.4 to 1 |
| 5 | `#c7bbaf` | `oklch(79.80% 0.0216 68.20)` | Sequoia Fog | black, 11.1 to 1 |
| 6 | `#c5b8ac` | `oklch(78.98% 0.0224 66.33)` | Froth | black, 10.8 to 1 |
| 7 | `#c3b5a9` | `oklch(78.11% 0.0233 64.32)` | Ash Grey | black, 10.4 to 1 |
| 8 | `#c1b2a6` | `oklch(77.19% 0.0241 62.23)` | Smokestack | black, 10.1 to 1 |
| 9 | `#beaea2` | `oklch(76.24% 0.0250 60.08)` | Blind Date | black, 9.8 to 1 |
| 10 | `#bcab9f` | `oklch(75.26% 0.0260 57.90)` | Crushed Stone | black, 9.4 to 1 |
| 11 | `#baa89c` | `oklch(74.28% 0.0269 55.72)` | Putty Grey | black, 9.1 to 1 |
| 12 | `#b7a499` | `oklch(73.31% 0.0278 53.58)` | Pick of the Litter | black, 8.8 to 1 |
| 13 | `#b5a196` | `oklch(72.35% 0.0287 51.52)` | Thorn Crown | black, 8.5 to 1 |
| 14 | `#b39e93` | `oklch(71.42% 0.0296 49.55)` | Big Horn Mountains | black, 8.2 to 1 |
| 15 | `#b19b90` | `oklch(70.53% 0.0305 47.72)` | Bidwell Brown | black, 7.9 to 1 |
| 16 | `#af988d` | `oklch(69.69% 0.0313 46.06)` | Wool Coat | black, 7.6 to 1 |
| 17 | `#ad958b` | `oklch(68.90% 0.0321 44.57)` | Rose Mauve | black, 7.4 to 1 |
| 18 | `#ab9389` | `oklch(68.10% 0.0329 43.13)` | Plush Suede | black, 7.2 to 1 |
| 19 | `#a99086` | `oklch(67.28% 0.0337 41.72)` | Hollow Brown | black, 7 to 1 |
| 20 | `#a78d84` | `oklch(66.45% 0.0345 40.36)` | Ecru Ochre | black, 6.7 to 1 |
| 21 | `#a58a81` | `oklch(65.62% 0.0353 39.03)` | Earthbound | black, 6.5 to 1 |
| 22 | `#a3877f` | `oklch(64.79% 0.0362 37.75)` | Pink Shade Granite | black, 6.3 to 1 |
| 23 | `#a1857d` | `oklch(63.97% 0.0370 36.52)` | Undercooked Bacon | black, 6.1 to 1 |
| 24 | `#9f827a` | `oklch(63.16% 0.0378 35.34)` | Modern Mocha | black, 5.9 to 1 |
| 25 | `#9d7f78` | `oklch(62.39% 0.0386 34.23)` | Cougar | black, 5.7 to 1 |
| 26 | `#9b7d76` | `oklch(61.64% 0.0393 33.17)` | Cougar | black, 5.5 to 1 |
| 27 | `#9a7b74` | `oklch(60.94% 0.0400 32.18)` | Wild Hemp | black, 5.4 to 1 |
| 28 | `#987872` | `oklch(60.28% 0.0407 31.26)` | Hickory Stick | black, 5.2 to 1 |
| 29 | `#967771` | `oklch(59.68% 0.0413 30.42)` | Hickory Stick | black, 5.1 to 1 |
| 30 | `#95756f` | `oklch(59.14% 0.0418 29.66)` | Mulberry Silk | black, 5 to 1 |
| 31 | `#94736e` | `oklch(58.66% 0.0423 28.98)` | Mulberry Silk | black, 4.9 to 1 |
| 32 | `#93726d` | `oklch(58.27% 0.0427 28.39)` | Oakwood Brown | black, 4.8 to 1 |

## CSS

```css
background: linear-gradient(180deg, #cdc3b8 0.0%, #ccc2b6 3.2%, #cac0b4 6.5%, #c9bdb1 9.7%, #c7bbaf 12.9%, #c5b8ac 16.1%, #c3b5a9 19.4%, #c1b2a6 22.6%, #beaea2 25.8%, #bcab9f 29.0%, #baa89c 32.3%, #b7a499 35.5%, #b5a196 38.7%, #b39e93 41.9%, #b19b90 45.2%, #af988d 48.4%, #ad958b 51.6%, #ab9389 54.8%, #a99086 58.1%, #a78d84 61.3%, #a58a81 64.5%, #a3877f 67.7%, #a1857d 71.0%, #9f827a 74.2%, #9d7f78 77.4%, #9b7d76 80.6%, #9a7b74 83.9%, #987872 87.1%, #967771 90.3%, #95756f 93.5%, #94736e 96.8%, #93726d 100.0%);
background: linear-gradient(180deg in oklch, oklch(82.28% 0.0193 73.83) 0.0%, oklch(81.81% 0.0197 72.77) 3.2%, oklch(81.23% 0.0203 71.46) 6.5%, oklch(80.56% 0.0209 69.93) 9.7%, oklch(79.80% 0.0216 68.20) 12.9%, oklch(78.98% 0.0224 66.33) 16.1%, oklch(78.11% 0.0233 64.32) 19.4%, oklch(77.19% 0.0241 62.23) 22.6%, oklch(76.24% 0.0250 60.08) 25.8%, oklch(75.26% 0.0260 57.90) 29.0%, oklch(74.28% 0.0269 55.72) 32.3%, oklch(73.31% 0.0278 53.58) 35.5%, oklch(72.35% 0.0287 51.52) 38.7%, oklch(71.42% 0.0296 49.55) 41.9%, oklch(70.53% 0.0305 47.72) 45.2%, oklch(69.69% 0.0313 46.06) 48.4%, oklch(68.90% 0.0321 44.57) 51.6%, oklch(68.10% 0.0329 43.13) 54.8%, oklch(67.28% 0.0337 41.72) 58.1%, oklch(66.45% 0.0345 40.36) 61.3%, oklch(65.62% 0.0353 39.03) 64.5%, oklch(64.79% 0.0362 37.75) 67.7%, oklch(63.97% 0.0370 36.52) 71.0%, oklch(63.16% 0.0378 35.34) 74.2%, oklch(62.39% 0.0386 34.23) 77.4%, oklch(61.64% 0.0393 33.17) 80.6%, oklch(60.94% 0.0400 32.18) 83.9%, oklch(60.28% 0.0407 31.26) 87.1%, oklch(59.68% 0.0413 30.42) 90.3%, oklch(59.14% 0.0418 29.66) 93.5%, oklch(58.66% 0.0423 28.98) 96.8%, oklch(58.27% 0.0427 28.39) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.823 | 0.019 | 73.8 |
| 2 | 0.693 | 0.032 | 45.3 |
| 3 | 0.583 | 0.043 | 28.4 |

## In these collections

- [App background gradients](https://grabient.com/app-background-gradients)
- [Neutral swatches](https://grabient.com/neutral-swatches)

## Other forms

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