# Gray and tan color palette

The Gray and tan color palette brings together gray and orange. The colors span a narrow 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 orange.

- Also called: Gray to tan linear gradient
- Seed: `kSfAc-zIs_dkVv0`
- Page: https://grabient.com/kSfAc-zIs_dkVv0?steps=32&angle=315
- Drawn as: linear gradient, 32 steps, 315 degrees
- Kinds: neutral, warm
- Hues: monochromatic
- Contrast of its darkest and lightest colors: 2.3 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 | `#62605a` | `oklch(48.82% 0.0096 87.89)` | Grey Werewolf | white, 6.3 to 1 |
| 2 | `#63615b` | `oklch(49.24% 0.0104 87.74)` | Gropius Grey | white, 6.1 to 1 |
| 3 | `#65625b` | `oklch(49.74% 0.0112 87.56)` | Braintree | white, 6 to 1 |
| 4 | `#67645c` | `oklch(50.33% 0.0122 87.35)` | Cumberland Grey | white, 5.9 to 1 |
| 5 | `#69665e` | `oklch(50.99% 0.0133 87.13)` | Cumberland Grey | white, 5.7 to 1 |
| 6 | `#6c685f` | `oklch(51.71% 0.0145 86.88)` | Catch of the Day | white, 5.5 to 1 |
| 7 | `#6e6a60` | `oklch(52.48% 0.0158 86.61)` | Archaeology | white, 5.3 to 1 |
| 8 | `#716c62` | `oklch(53.29% 0.0171 86.33)` | Dusty Mountain | white, 5.2 to 1 |
| 9 | `#746e63` | `oklch(54.12% 0.0185 86.03)` | Randall | white, 5 to 1 |
| 10 | `#777165` | `oklch(54.98% 0.0200 85.73)` | King Fischer | white, 4.8 to 1 |
| 11 | `#7a7366` | `oklch(55.84% 0.0215 85.41)` | Palm Lane | white, 4.6 to 1 |
| 12 | `#7d7667` | `oklch(56.70% 0.0231 85.09)` | Aged Olive | black, 4.6 to 1 |
| 13 | `#807869` | `oklch(57.54% 0.0247 84.77)` | Camel’s Hump | black, 4.8 to 1 |
| 14 | `#837a6a` | `oklch(58.36% 0.0263 84.45)` | Centre Ridge | black, 4.9 to 1 |
| 15 | `#867d6b` | `oklch(59.15% 0.0279 84.13)` | Winter Twig | black, 5.1 to 1 |
| 16 | `#887f6c` | `oklch(59.89% 0.0295 83.82)` | Mossy Aura | black, 5.2 to 1 |
| 17 | `#8b816d` | `oklch(60.58% 0.0311 83.51)` | Army Issue | black, 5.4 to 1 |
| 18 | `#8e836e` | `oklch(61.29% 0.0329 83.17)` | Faint Allegory | black, 5.5 to 1 |
| 19 | `#91856f` | `oklch(62.02% 0.0348 82.81)` | Faint Allegory | black, 5.7 to 1 |
| 20 | `#948770` | `oklch(62.76% 0.0369 82.44)` | Shipwreck | black, 5.9 to 1 |
| 21 | `#978970` | `oklch(63.50% 0.0390 82.05)` | Limbert Leather | black, 6.1 to 1 |
| 22 | `#9a8b71` | `oklch(64.24% 0.0411 81.65)` | Tawny Owl | black, 6.2 to 1 |
| 23 | `#9d8d71` | `oklch(64.98% 0.0433 81.25)` | Pale Oyster | black, 6.4 to 1 |
| 24 | `#a08f72` | `oklch(65.69% 0.0455 80.86)` | Britches | black, 6.6 to 1 |
| 25 | `#a39172` | `oklch(66.39% 0.0477 80.47)` | Natural Bridge | black, 6.8 to 1 |
| 26 | `#a69373` | `oklch(67.06% 0.0498 80.09)` | San Antonio Sage | black, 7 to 1 |
| 27 | `#a89473` | `oklch(67.69% 0.0518 79.73)` | Roycroft Suede | black, 7.1 to 1 |
| 28 | `#ab9674` | `oklch(68.28% 0.0536 79.39)` | Quail Valley | black, 7.3 to 1 |
| 29 | `#ad9774` | `oklch(68.82% 0.0553 79.09)` | Jute | black, 7.4 to 1 |
| 30 | `#b09974` | `oklch(69.30% 0.0569 78.81)` | Toasted Sesame | black, 7.6 to 1 |
| 31 | `#b29a75` | `oklch(69.72% 0.0582 78.57)` | Dry Starfish | black, 7.7 to 1 |
| 32 | `#b39b75` | `oklch(70.08% 0.0593 78.38)` | Ginger Tea | black, 7.8 to 1 |

## CSS

```css
background: linear-gradient(315deg, #62605a 0.0%, #63615b 3.2%, #65625b 6.5%, #67645c 9.7%, #69665e 12.9%, #6c685f 16.1%, #6e6a60 19.4%, #716c62 22.6%, #746e63 25.8%, #777165 29.0%, #7a7366 32.3%, #7d7667 35.5%, #807869 38.7%, #837a6a 41.9%, #867d6b 45.2%, #887f6c 48.4%, #8b816d 51.6%, #8e836e 54.8%, #91856f 58.1%, #948770 61.3%, #978970 64.5%, #9a8b71 67.7%, #9d8d71 71.0%, #a08f72 74.2%, #a39172 77.4%, #a69373 80.6%, #a89473 83.9%, #ab9674 87.1%, #ad9774 90.3%, #b09974 93.5%, #b29a75 96.8%, #b39b75 100.0%);
background: linear-gradient(315deg in oklch, oklch(48.82% 0.0096 87.89) 0.0%, oklch(49.24% 0.0104 87.74) 3.2%, oklch(49.74% 0.0112 87.56) 6.5%, oklch(50.33% 0.0122 87.35) 9.7%, oklch(50.99% 0.0133 87.13) 12.9%, oklch(51.71% 0.0145 86.88) 16.1%, oklch(52.48% 0.0158 86.61) 19.4%, oklch(53.29% 0.0171 86.33) 22.6%, oklch(54.12% 0.0185 86.03) 25.8%, oklch(54.98% 0.0200 85.73) 29.0%, oklch(55.84% 0.0215 85.41) 32.3%, oklch(56.70% 0.0231 85.09) 35.5%, oklch(57.54% 0.0247 84.77) 38.7%, oklch(58.36% 0.0263 84.45) 41.9%, oklch(59.15% 0.0279 84.13) 45.2%, oklch(59.89% 0.0295 83.82) 48.4%, oklch(60.58% 0.0311 83.51) 51.6%, oklch(61.29% 0.0329 83.17) 54.8%, oklch(62.02% 0.0348 82.81) 58.1%, oklch(62.76% 0.0369 82.44) 61.3%, oklch(63.50% 0.0390 82.05) 64.5%, oklch(64.24% 0.0411 81.65) 67.7%, oklch(64.98% 0.0433 81.25) 71.0%, oklch(65.69% 0.0455 80.86) 74.2%, oklch(66.39% 0.0477 80.47) 77.4%, oklch(67.06% 0.0498 80.09) 80.6%, oklch(67.69% 0.0518 79.73) 83.9%, oklch(68.28% 0.0536 79.39) 87.1%, oklch(68.82% 0.0553 79.09) 90.3%, oklch(69.30% 0.0569 78.81) 93.5%, oklch(69.72% 0.0582 78.57) 96.8%, oklch(70.08% 0.0593 78.38) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.488 | 0.01 | 87.9 |
| 2 | 0.602 | 0.03 | 83.7 |
| 3 | 0.701 | 0.059 | 78.4 |

## In these collections

- [Warm neutral gradients](https://grabient.com/warm-neutral-gradients)
- [Minimal color palette](https://grabient.com/minimal-color-palette)
- [Beige](https://grabient.com/beige)

## Other forms

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