# Off-white, gray and stone silver palette

Seamless gray and brown angular gradient with 32 colors: #eae8e7, #dddbd8, #ccc7c2, #b9b1aa, #a59a92, #93867d, #817269, #6d5e54, #5a4b40, #4a3b31, #413029, #3e2c2b, #403035, #423a43, #474650, #4d525a, #535b63, #59656e, #5e6e7a, #657887, #6c8294, #758c9f, #7f97a8, #8aa1b1, #96abba, #a2b6c2, #aec0ca, #bbcbd2, #c9d6db, #d7e1e4, #e4eaeb, #ecf0f1. Edit it and copy or download CSS, SVG, PNG or shader code.

- Also called: Seamless gray and brown angular gradient
- Seed: `ka7QI0zoe9yiKPe5ha7To4-mSJPt5Ab1g`
- Page: https://grabient.com/ka7QI0zoe9yiKPe5ha7To4-mSJPt5Ab1g?style=angularGradient&steps=32&angle=180
- Drawn as: angular gradient, 32 steps, 180 degrees
- Kinds: dark center, neutral, seamless
- Hues: monochromatic
- Contrast of its darkest and lightest colors: 11.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 | `#eae8e7` | `oklch(93.31% 0.0028 73.83)` | Polish White | black, 17.2 to 1 |
| 2 | `#dddbd8` | `oklch(89.17% 0.0053 71.47)` | Clear Cinnamon | black, 15.1 to 1 |
| 3 | `#ccc7c2` | `oklch(83.33% 0.0089 68.13)` | Vanilla Quake | black, 12.5 to 1 |
| 4 | `#b9b1aa` | `oklch(76.52% 0.0130 64.24)` | City Street | black, 9.9 to 1 |
| 5 | `#a59a92` | `oklch(69.44% 0.0170 60.20)` | Aspen Grey | black, 7.6 to 1 |
| 6 | `#93867d` | `oklch(62.82% 0.0202 56.44)` | Abandoned Mansion | black, 5.9 to 1 |
| 7 | `#817269` | `oklch(56.42% 0.0226 54.47)` | Tattletail | white, 4.6 to 1 |
| 8 | `#6d5e54` | `oklch(49.32% 0.0247 54.98)` | Kabul | white, 6.2 to 1 |
| 9 | `#5a4b40` | `oklch(42.37% 0.0264 55.22)` | Cork | white, 8.3 to 1 |
| 10 | `#4a3b31` | `oklch(36.50% 0.0274 52.37)` | Demitasse | white, 10.7 to 1 |
| 11 | `#413029` | `oklch(32.59% 0.0277 43.65)` | Chinese Ink | white, 12.5 to 1 |
| 12 | `#3e2c2b` | `oklch(31.47% 0.0266 25.57)` | Wenge Black | white, 13 to 1 |
| 13 | `#403035` | `oklch(32.89% 0.0237 357.02)` | Venous Blood Red | white, 12.4 to 1 |
| 14 | `#423a43` | `oklch(35.98% 0.0200 323.38)` | Nevermore | white, 10.9 to 1 |
| 15 | `#474650` | `oklch(39.86% 0.0167 290.30)` | Gun Powder | white, 9.3 to 1 |
| 16 | `#4d525a` | `oklch(43.67% 0.0150 263.48)` | Evening Cityscape | white, 7.8 to 1 |
| 17 | `#535b63` | `oklch(46.75% 0.0162 247.79)` | Titanium Grey | white, 6.8 to 1 |
| 18 | `#59656e` | `oklch(49.82% 0.0205 241.01)` | Slate Grey | white, 6 to 1 |
| 19 | `#5e6e7a` | `oklch(53.03% 0.0264 239.85)` | Smoky Pitch | white, 5.2 to 1 |
| 20 | `#657887` | `oklch(56.31% 0.0325 241.46)` | Space Convoy | black, 4.5 to 1 |
| 21 | `#6c8294` | `oklch(59.62% 0.0371 242.99)` | Gilneas Grey | black, 5.2 to 1 |
| 22 | `#758c9f` | `oklch(62.91% 0.0388 241.91)` | Blue Grey | black, 6 to 1 |
| 23 | `#7f97a8` | `oklch(66.25% 0.0378 240.24)` | Weldon Blue | black, 6.8 to 1 |
| 24 | `#8aa1b1` | `oklch(69.65% 0.0353 238.77)` | Qiān Hūi Grey | black, 7.8 to 1 |
| 25 | `#96abba` | `oklch(73.04% 0.0317 237.19)` | Cool Customer | black, 8.8 to 1 |
| 26 | `#a2b6c2` | `oklch(76.40% 0.0278 235.22)` | Country Air | black, 9.9 to 1 |
| 27 | `#aec0ca` | `oklch(79.68% 0.0242 232.53)` | Liberty Grey | black, 11.1 to 1 |
| 28 | `#bbcbd2` | `oklch(83.18% 0.0202 228.64)` | Happy-Go-Lucky | black, 12.5 to 1 |
| 29 | `#c9d6db` | `oklch(86.81% 0.0156 223.92)` | Clear to See | black, 14.1 to 1 |
| 30 | `#d7e1e4` | `oklch(90.26% 0.0109 219.09)` | Tahoe Snow | black, 15.7 to 1 |
| 31 | `#e4eaeb` | `oklch(93.19% 0.0069 214.85)` | Calla Lily | black, 17.2 to 1 |
| 32 | `#ecf0f1` | `oklch(95.28% 0.0041 211.91)` | Bái Sè White | black, 18.3 to 1 |

## CSS

```css
background: conic-gradient(from 180deg, #eae8e7 0.0%, #dddbd8 3.2%, #ccc7c2 6.5%, #b9b1aa 9.7%, #a59a92 12.9%, #93867d 16.1%, #817269 19.4%, #6d5e54 22.6%, #5a4b40 25.8%, #4a3b31 29.0%, #413029 32.3%, #3e2c2b 35.5%, #403035 38.7%, #423a43 41.9%, #474650 45.2%, #4d525a 48.4%, #535b63 51.6%, #59656e 54.8%, #5e6e7a 58.1%, #657887 61.3%, #6c8294 64.5%, #758c9f 67.7%, #7f97a8 71.0%, #8aa1b1 74.2%, #96abba 77.4%, #a2b6c2 80.6%, #aec0ca 83.9%, #bbcbd2 87.1%, #c9d6db 90.3%, #d7e1e4 93.5%, #e4eaeb 96.8%, #ecf0f1 100.0%);
background: conic-gradient(from 180deg in oklch, oklch(93.31% 0.0028 73.83) 0.0%, oklch(89.17% 0.0053 71.47) 3.2%, oklch(83.33% 0.0089 68.13) 6.5%, oklch(76.52% 0.0130 64.24) 9.7%, oklch(69.44% 0.0170 60.20) 12.9%, oklch(62.82% 0.0202 56.44) 16.1%, oklch(56.42% 0.0226 54.47) 19.4%, oklch(49.32% 0.0247 54.98) 22.6%, oklch(42.37% 0.0264 55.22) 25.8%, oklch(36.50% 0.0274 52.37) 29.0%, oklch(32.59% 0.0277 43.65) 32.3%, oklch(31.47% 0.0266 25.57) 35.5%, oklch(32.89% 0.0237 357.02) 38.7%, oklch(35.98% 0.0200 323.38) 41.9%, oklch(39.86% 0.0167 290.30) 45.2%, oklch(43.67% 0.0150 263.48) 48.4%, oklch(46.75% 0.0162 247.79) 51.6%, oklch(49.82% 0.0205 241.01) 54.8%, oklch(53.03% 0.0264 239.85) 58.1%, oklch(56.31% 0.0325 241.46) 61.3%, oklch(59.62% 0.0371 242.99) 64.5%, oklch(62.91% 0.0388 241.91) 67.7%, oklch(66.25% 0.0378 240.24) 71.0%, oklch(69.65% 0.0353 238.77) 74.2%, oklch(73.04% 0.0317 237.19) 77.4%, oklch(76.40% 0.0278 235.22) 80.6%, oklch(79.68% 0.0242 232.53) 83.9%, oklch(83.18% 0.0202 228.64) 87.1%, oklch(86.81% 0.0156 223.92) 90.3%, oklch(90.26% 0.0109 219.09) 93.5%, oklch(93.19% 0.0069 214.85) 96.8%, oklch(95.28% 0.0041 211.91) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.933 | 0.003 | 73.8 |
| 2 | 0.618 | 0.021 | 55.9 |
| 3 | 0.319 | 0.028 | 39 |
| 4 | 0.453 | 0.015 | -105.8 |
| 5 | 0.618 | 0.039 | -117.4 |
| 6 | 0.791 | 0.025 | -127 |
| 7 | 0.953 | 0.004 | -148.1 |

## In these collections

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

## Other forms

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