# Charcoal tan palette

The Charcoal tan palette brings together light orange, orange, and gray. The colors span a moderate lightness range, combining restrained color with gentle contrast. Its balanced and composed character suits brand mood boards and editorial graphics. Its darkest tone is gray, and its lightest tone is light orange.

- Also called: Warm gray linear gradient
- Seed: `kUtRswzYs_EIGvq2gr1g`
- Page: https://grabient.com/kUtRswzYs_EIGvq2gr1g?steps=32&angle=180
- Drawn as: linear gradient, 32 steps, 180 degrees
- Kinds: neutral, warm
- Hues: monochromatic
- Contrast of its darkest and lightest colors: 3.1 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 | `#b29e8a` | `oklch(71.26% 0.0372 68.20)` | Easily Suede | black, 8.1 to 1 |
| 2 | `#b09d88` | `oklch(70.67% 0.0368 67.79)` | Over the Taupe | black, 8 to 1 |
| 3 | `#ae9a87` | `oklch(69.91% 0.0364 67.28)` | Majestic Elk | black, 7.7 to 1 |
| 4 | `#ab9784` | `oklch(69.00% 0.0359 66.69)` | Quicksand | black, 7.5 to 1 |
| 5 | `#a89482` | `oklch(67.99% 0.0353 66.02)` | Silent Sands | black, 7.2 to 1 |
| 6 | `#a4917f` | `oklch(66.90% 0.0346 65.29)` | Rapid Rock | black, 6.9 to 1 |
| 7 | `#a18e7c` | `oklch(65.76% 0.0339 64.51)` | Cocoa Whip | black, 6.6 to 1 |
| 8 | `#9d8a79` | `oklch(64.60% 0.0332 63.69)` | Sycamore Tan | black, 6.3 to 1 |
| 9 | `#998777` | `oklch(63.46% 0.0324 62.84)` | Junkrat | black, 6 to 1 |
| 10 | `#968374` | `oklch(62.36% 0.0315 61.97)` | Dry Brown | black, 5.8 to 1 |
| 11 | `#928072` | `oklch(61.34% 0.0306 61.10)` | Roasted Cashew | black, 5.5 to 1 |
| 12 | `#8f7e70` | `oklch(60.41% 0.0297 60.23)` | Bridle Leather | black, 5.3 to 1 |
| 13 | `#8c7b6e` | `oklch(59.50% 0.0286 59.40)` | Road Less-Travelled | black, 5.1 to 1 |
| 14 | `#89786c` | `oklch(58.60% 0.0275 58.57)` | Mocha Magic | black, 4.9 to 1 |
| 15 | `#86766b` | `oklch(57.72% 0.0263 57.72)` | Gosling | black, 4.8 to 1 |
| 16 | `#837469` | `oklch(56.85% 0.0250 56.84)` | Mocha Bean | black, 4.6 to 1 |
| 17 | `#807167` | `oklch(55.99% 0.0237 55.91)` | Desert Taupe | white, 4.6 to 1 |
| 18 | `#7d6f66` | `oklch(55.13% 0.0224 54.90)` | Shadow Cliff | white, 4.8 to 1 |
| 19 | `#7a6c64` | `oklch(54.28% 0.0212 53.79)` | Namibia | white, 5 to 1 |
| 20 | `#776a63` | `oklch(53.42% 0.0199 52.58)` | Cocoa Powder | white, 5.2 to 1 |
| 21 | `#746861` | `oklch(52.55% 0.0187 51.22)` | Garret Brown | white, 5.4 to 1 |
| 22 | `#71655f` | `oklch(51.67% 0.0175 49.71)` | Morel | white, 5.6 to 1 |
| 23 | `#6e635d` | `oklch(50.73% 0.0163 47.88)` | Fozzie Bear | white, 5.8 to 1 |
| 24 | `#6a605b` | `oklch(49.75% 0.0151 45.76)` | Bull Ring | white, 6 to 1 |
| 25 | `#675d59` | `oklch(48.73% 0.0139 43.46)` | Oswego Tea | white, 6.3 to 1 |
| 26 | `#635b57` | `oklch(47.71% 0.0126 41.04)` | Caveman | white, 6.6 to 1 |
| 27 | `#605855` | `oklch(46.71% 0.0114 38.61)` | Lahar | white, 6.9 to 1 |
| 28 | `#5d5553` | `oklch(45.76% 0.0103 36.23)` | Wolf’s Fur | white, 7.2 to 1 |
| 29 | `#5a5352` | `oklch(44.88% 0.0092 34.01)` | Catskill Brown | white, 7.5 to 1 |
| 30 | `#575150` | `oklch(44.10% 0.0083 32.02)` | Mortar | white, 7.7 to 1 |
| 31 | `#554f4e` | `oklch(43.43% 0.0075 30.36)` | Berry Brown | white, 7.9 to 1 |
| 32 | `#534e4d` | `oklch(42.91% 0.0069 29.10)` | Keshizumi Cinder | white, 8.1 to 1 |

## CSS

```css
background: linear-gradient(180deg, #b29e8a 0.0%, #b09d88 3.2%, #ae9a87 6.5%, #ab9784 9.7%, #a89482 12.9%, #a4917f 16.1%, #a18e7c 19.4%, #9d8a79 22.6%, #998777 25.8%, #968374 29.0%, #928072 32.3%, #8f7e70 35.5%, #8c7b6e 38.7%, #89786c 41.9%, #86766b 45.2%, #837469 48.4%, #807167 51.6%, #7d6f66 54.8%, #7a6c64 58.1%, #776a63 61.3%, #746861 64.5%, #71655f 67.7%, #6e635d 71.0%, #6a605b 74.2%, #675d59 77.4%, #635b57 80.6%, #605855 83.9%, #5d5553 87.1%, #5a5352 90.3%, #575150 93.5%, #554f4e 96.8%, #534e4d 100.0%);
background: linear-gradient(180deg in oklch, oklch(71.26% 0.0372 68.20) 0.0%, oklch(70.67% 0.0368 67.79) 3.2%, oklch(69.91% 0.0364 67.28) 6.5%, oklch(69.00% 0.0359 66.69) 9.7%, oklch(67.99% 0.0353 66.02) 12.9%, oklch(66.90% 0.0346 65.29) 16.1%, oklch(65.76% 0.0339 64.51) 19.4%, oklch(64.60% 0.0332 63.69) 22.6%, oklch(63.46% 0.0324 62.84) 25.8%, oklch(62.36% 0.0315 61.97) 29.0%, oklch(61.34% 0.0306 61.10) 32.3%, oklch(60.41% 0.0297 60.23) 35.5%, oklch(59.50% 0.0286 59.40) 38.7%, oklch(58.60% 0.0275 58.57) 41.9%, oklch(57.72% 0.0263 57.72) 45.2%, oklch(56.85% 0.0250 56.84) 48.4%, oklch(55.99% 0.0237 55.91) 51.6%, oklch(55.13% 0.0224 54.90) 54.8%, oklch(54.28% 0.0212 53.79) 58.1%, oklch(53.42% 0.0199 52.58) 61.3%, oklch(52.55% 0.0187 51.22) 64.5%, oklch(51.67% 0.0175 49.71) 67.7%, oklch(50.73% 0.0163 47.88) 71.0%, oklch(49.75% 0.0151 45.76) 74.2%, oklch(48.73% 0.0139 43.46) 77.4%, oklch(47.71% 0.0126 41.04) 80.6%, oklch(46.71% 0.0114 38.61) 83.9%, oklch(45.76% 0.0103 36.23) 87.1%, oklch(44.88% 0.0092 34.01) 90.3%, oklch(44.10% 0.0083 32.02) 93.5%, oklch(43.43% 0.0075 30.36) 96.8%, oklch(42.91% 0.0069 29.10) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.713 | 0.037 | 68.2 |
| 2 | 0.61 | 0.03 | 60.8 |
| 3 | 0.52 | 0.018 | 50.2 |
| 4 | 0.429 | 0.007 | 29.1 |

## In these collections

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

## Other forms

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