# Quiet Tan Shadow Fade

This horizontal gradient begins in soft off-white, passes through pale stone, gray taupe, and muted tan, then closes through deep brown into near-black umber. Its restrained neutral route provides both light and dark areas without a sharp color break. Use it for natural product backgrounds, understated editorial layouts, material studies, or warm neutral interface panels.

- Also called: White, gray and brown linear gradient
- Seed: `kS8wg2ywPA5wQPy`
- Page: https://grabient.com/kS8wg2ywPA5wQPy?steps=32
- Drawn as: linear gradient, 32 steps, 90 degrees
- Kinds: light to dark, neutral
- Hues: monochromatic
- Contrast of its darkest and lightest colors: 15.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 | `#f5f0e9` | `oklch(95.67% 0.0110 76.64)` | Billowy Clouds | black, 18.5 to 1 |
| 2 | `#f0ebe4` | `oklch(94.34% 0.0109 76.98)` | Pearl Drops | black, 17.7 to 1 |
| 3 | `#ebe6df` | `oklch(92.74% 0.0107 77.43)` | Desert Storm | black, 16.9 to 1 |
| 4 | `#e5e0d9` | `oklch(90.89% 0.0103 77.97)` | Timid Lime | black, 16 to 1 |
| 5 | `#ded9d3` | `oklch(88.83% 0.0099 78.59)` | Simple White | black, 15 to 1 |
| 6 | `#d6d2cc` | `oklch(86.58% 0.0094 79.26)` | Santo | black, 13.9 to 1 |
| 7 | `#cecac5` | `oklch(84.18% 0.0089 79.98)` | Gravel Drive | black, 12.9 to 1 |
| 8 | `#c6c2bd` | `oklch(81.64% 0.0085 80.71)` | Gallery Grey | black, 11.8 to 1 |
| 9 | `#bdbab5` | `oklch(79.01% 0.0081 81.45)` | Silver Bonnet | black, 10.8 to 1 |
| 10 | `#b4b2ad` | `oklch(76.31% 0.0078 82.16)` | Steam Engine | black, 9.8 to 1 |
| 11 | `#aca9a4` | `oklch(73.56% 0.0075 82.84)` | Ellie Grey | black, 8.9 to 1 |
| 12 | `#a3a19c` | `oklch(70.81% 0.0075 83.47)` | Grey Gloss | black, 8 to 1 |
| 13 | `#9b9893` | `oklch(68.07% 0.0076 84.02)` | Pewter Cast | black, 7.3 to 1 |
| 14 | `#92908b` | `oklch(65.38% 0.0079 84.48)` | Mole Grey | black, 6.5 to 1 |
| 15 | `#8b8883` | `oklch(62.77% 0.0084 84.82)` | Pewter Ring | black, 5.9 to 1 |
| 16 | `#83817b` | `oklch(60.26% 0.0091 85.04)` | Glen Plaid | black, 5.3 to 1 |
| 17 | `#7d7973` | `oklch(57.85% 0.0102 85.11)` | Amazon Stone | black, 4.8 to 1 |
| 18 | `#76726b` | `oklch(55.33% 0.0117 85.04)` | Vintage Boots | white, 4.7 to 1 |
| 19 | `#6f6a62` | `oklch(52.70% 0.0135 84.84)` | Burnished Pewter | white, 5.3 to 1 |
| 20 | `#676359` | `oklch(49.99% 0.0157 84.54)` | Braintree | white, 6 to 1 |
| 21 | `#605b50` | `oklch(47.23% 0.0181 84.15)` | Night Mission | white, 6.7 to 1 |
| 22 | `#595347` | `oklch(44.45% 0.0206 83.68)` | Tarmac | white, 7.6 to 1 |
| 23 | `#524b3e` | `oklch(41.67% 0.0233 83.16)` | Arrowhead | white, 8.5 to 1 |
| 24 | `#4c4435` | `oklch(38.94% 0.0261 82.60)` | Limonite Brown | white, 9.6 to 1 |
| 25 | `#453d2c` | `oklch(36.27% 0.0289 82.01)` | Typhus Corrosion | white, 10.7 to 1 |
| 26 | `#403624` | `oklch(33.70% 0.0316 81.43)` | Mikado | white, 11.9 to 1 |
| 27 | `#3a2f1d` | `oklch(31.26% 0.0343 80.85)` | Agrax Earthshade | white, 13 to 1 |
| 28 | `#352915` | `oklch(28.98% 0.0368 80.31)` | Brown Tumbleweed | white, 14.1 to 1 |
| 29 | `#30240e` | `oklch(26.89% 0.0391 79.81)` | Black Slug | white, 15.1 to 1 |
| 30 | `#2c1f08` | `oklch(25.01% 0.0411 79.37)` | Coffee Grounds | white, 16 to 1 |
| 31 | `#291b04` | `oklch(23.39% 0.0428 79.01)` | Brunneophobia | white, 16.7 to 1 |
| 32 | `#261801` | `oklch(22.05% 0.0441 78.75)` | Cannon Black | white, 17.3 to 1 |

## CSS

```css
background: linear-gradient(90deg, #f5f0e9 0.0%, #f0ebe4 3.2%, #ebe6df 6.5%, #e5e0d9 9.7%, #ded9d3 12.9%, #d6d2cc 16.1%, #cecac5 19.4%, #c6c2bd 22.6%, #bdbab5 25.8%, #b4b2ad 29.0%, #aca9a4 32.3%, #a3a19c 35.5%, #9b9893 38.7%, #92908b 41.9%, #8b8883 45.2%, #83817b 48.4%, #7d7973 51.6%, #76726b 54.8%, #6f6a62 58.1%, #676359 61.3%, #605b50 64.5%, #595347 67.7%, #524b3e 71.0%, #4c4435 74.2%, #453d2c 77.4%, #403624 80.6%, #3a2f1d 83.9%, #352915 87.1%, #30240e 90.3%, #2c1f08 93.5%, #291b04 96.8%, #261801 100.0%);
background: linear-gradient(90deg in oklch, oklch(95.67% 0.0110 76.64) 0.0%, oklch(94.34% 0.0109 76.98) 3.2%, oklch(92.74% 0.0107 77.43) 6.5%, oklch(90.89% 0.0103 77.97) 9.7%, oklch(88.83% 0.0099 78.59) 12.9%, oklch(86.58% 0.0094 79.26) 16.1%, oklch(84.18% 0.0089 79.98) 19.4%, oklch(81.64% 0.0085 80.71) 22.6%, oklch(79.01% 0.0081 81.45) 25.8%, oklch(76.31% 0.0078 82.16) 29.0%, oklch(73.56% 0.0075 82.84) 32.3%, oklch(70.81% 0.0075 83.47) 35.5%, oklch(68.07% 0.0076 84.02) 38.7%, oklch(65.38% 0.0079 84.48) 41.9%, oklch(62.77% 0.0084 84.82) 45.2%, oklch(60.26% 0.0091 85.04) 48.4%, oklch(57.85% 0.0102 85.11) 51.6%, oklch(55.33% 0.0117 85.04) 54.8%, oklch(52.70% 0.0135 84.84) 58.1%, oklch(49.99% 0.0157 84.54) 61.3%, oklch(47.23% 0.0181 84.15) 64.5%, oklch(44.45% 0.0206 83.68) 67.7%, oklch(41.67% 0.0233 83.16) 71.0%, oklch(38.94% 0.0261 82.60) 74.2%, oklch(36.27% 0.0289 82.01) 77.4%, oklch(33.70% 0.0316 81.43) 80.6%, oklch(31.26% 0.0343 80.85) 83.9%, oklch(28.98% 0.0368 80.31) 87.1%, oklch(26.89% 0.0391 79.81) 90.3%, oklch(25.01% 0.0411 79.37) 93.5%, oklch(23.39% 0.0428 79.01) 96.8%, oklch(22.05% 0.0441 78.75) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.957 | 0.011 | 76.6 |
| 2 | 0.591 | 0.01 | 85.1 |
| 3 | 0.22 | 0.044 | 78.8 |

## In these collections

- [Tan color palette](https://grabient.com/tan-color-palette)

## Other forms

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