# Stone, gray and near-black color palette

The Stone, gray and near-black color palette brings together off-white, light gray, gray, dark gray, and black. The colors span a very broad lightness range, combining near-neutral color with high contrast. Its quiet and understated character suits brand mood boards and editorial graphics. Its darkest tone is black, and its lightest tone is off-white.

- Also called: White, gray and black radial gradient
- Seed: `kW-QKuaoNAUmFQGohMBjwJAY`
- Page: https://grabient.com/kW-QKuaoNAUmFQGohMBjwJAY?style=radialGradient&steps=32&angle=135
- Drawn as: radial gradient, 32 steps, 135 degrees
- Kinds: light to dark, neutral
- Hues: achromatic
- Contrast of its darkest and lightest colors: 19.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 | `#f7f9fa` | `oklch(98.03% 0.0028 244.69)` | Zhēn Zhū Bái Pearl | black, 19.8 to 1 |
| 2 | `#f3f5f7` | `oklch(96.98% 0.0032 244.93)` | Chef’s Hat | black, 19.2 to 1 |
| 3 | `#eff1f3` | `oklch(95.67% 0.0038 245.25)` | Maui Mist | black, 18.5 to 1 |
| 4 | `#e9ecee` | `oklch(94.12% 0.0045 245.64)` | Icewind Dale | black, 17.6 to 1 |
| 5 | `#e3e6e9` | `oklch(92.33% 0.0053 246.06)` | Little Dipper | black, 16.7 to 1 |
| 6 | `#dcdfe3` | `oklch(90.34% 0.0061 246.53)` | Terminator Chrome | black, 15.7 to 1 |
| 7 | `#d4d8dc` | `oklch(88.14% 0.0069 247.01)` | Supreme Pontiff | black, 14.7 to 1 |
| 8 | `#ccd1d5` | `oklch(85.76% 0.0077 247.50)` | Salina Springs | black, 13.6 to 1 |
| 9 | `#c4c8cd` | `oklch(83.20% 0.0084 247.98)` | Herring Silver | black, 12.5 to 1 |
| 10 | `#babfc5` | `oklch(80.34% 0.0092 248.48)` | Blue to You | black, 11.3 to 1 |
| 11 | `#b0b5bb` | `oklch(77.18% 0.0101 249.01)` | Cloud Cover | black, 10.2 to 1 |
| 12 | `#a5abb1` | `oklch(73.80% 0.0109 249.56)` | Laundry Blue | black, 9 to 1 |
| 13 | `#9aa0a6` | `oklch(70.27% 0.0118 250.12)` | Grey Wolf | black, 7.9 to 1 |
| 14 | `#8f959c` | `oklch(66.67% 0.0125 250.68)` | Dusky Grouse | black, 6.9 to 1 |
| 15 | `#848a91` | `oklch(63.08% 0.0131 251.25)` | Necron Compound | black, 6 to 1 |
| 16 | `#798087` | `oklch(59.57% 0.0136 251.81)` | Downing Slate | black, 5.2 to 1 |
| 17 | `#6f767d` | `oklch(56.19% 0.0139 252.36)` | Spitsbergen Blue | white, 4.6 to 1 |
| 18 | `#656c73` | `oklch(52.76% 0.0140 252.90)` | Wall Street | white, 5.3 to 1 |
| 19 | `#5c6269` | `oklch(49.28% 0.0140 253.45)` | Calligraphy | white, 6.1 to 1 |
| 20 | `#52585f` | `oklch(45.81% 0.0139 253.99)` | Edge of Black | white, 7.1 to 1 |
| 21 | `#494f56` | `oklch(42.37% 0.0137 254.54)` | Lamp Post | white, 8.3 to 1 |
| 22 | `#40454c` | `oklch(39.00% 0.0134 255.08)` | Alpine Duck Grey | white, 9.5 to 1 |
| 23 | `#383d43` | `oklch(35.75% 0.0130 255.63)` | Ferry | white, 10.9 to 1 |
| 24 | `#30353b` | `oklch(32.64% 0.0125 256.18)` | Blue Plaza | white, 12.3 to 1 |
| 25 | `#292d33` | `oklch(29.63% 0.0119 256.74)` | Deep Space Echo | white, 13.8 to 1 |
| 26 | `#22262b` | `oklch(26.56% 0.0111 257.35)` | Black Beauty | white, 15.2 to 1 |
| 27 | `#1b1e23` | `oklch(23.51% 0.0101 257.98)` | Satin Deep Black | white, 16.6 to 1 |
| 28 | `#15181c` | `oklch(20.58% 0.0090 258.61)` | Aswad Black | white, 17.8 to 1 |
| 29 | `#0f1115` | `oklch(17.85% 0.0079 259.21)` | Ruined Smores | white, 18.8 to 1 |
| 30 | `#0a0c0f` | `oklch(15.42% 0.0069 259.75)` | Black Wash | white, 19.5 to 1 |
| 31 | `#07080a` | `oklch(13.38% 0.0061 260.20)` | Reversed Grey | white, 20 to 1 |
| 32 | `#050507` | `oklch(11.81% 0.0055 260.54)` | Black Metal | white, 20.3 to 1 |

## CSS

```css
background: radial-gradient(circle at 50% 50%, #f7f9fa 0.0%, #f3f5f7 3.2%, #eff1f3 6.5%, #e9ecee 9.7%, #e3e6e9 12.9%, #dcdfe3 16.1%, #d4d8dc 19.4%, #ccd1d5 22.6%, #c4c8cd 25.8%, #babfc5 29.0%, #b0b5bb 32.3%, #a5abb1 35.5%, #9aa0a6 38.7%, #8f959c 41.9%, #848a91 45.2%, #798087 48.4%, #6f767d 51.6%, #656c73 54.8%, #5c6269 58.1%, #52585f 61.3%, #494f56 64.5%, #40454c 67.7%, #383d43 71.0%, #30353b 74.2%, #292d33 77.4%, #22262b 80.6%, #1b1e23 83.9%, #15181c 87.1%, #0f1115 90.3%, #0a0c0f 93.5%, #07080a 96.8%, #050507 100.0%);
background: radial-gradient(circle at 50% 50% in oklch, oklch(98.03% 0.0028 244.69) 0.0%, oklch(96.98% 0.0032 244.93) 3.2%, oklch(95.67% 0.0038 245.25) 6.5%, oklch(94.12% 0.0045 245.64) 9.7%, oklch(92.33% 0.0053 246.06) 12.9%, oklch(90.34% 0.0061 246.53) 16.1%, oklch(88.14% 0.0069 247.01) 19.4%, oklch(85.76% 0.0077 247.50) 22.6%, oklch(83.20% 0.0084 247.98) 25.8%, oklch(80.34% 0.0092 248.48) 29.0%, oklch(77.18% 0.0101 249.01) 32.3%, oklch(73.80% 0.0109 249.56) 35.5%, oklch(70.27% 0.0118 250.12) 38.7%, oklch(66.67% 0.0125 250.68) 41.9%, oklch(63.08% 0.0131 251.25) 45.2%, oklch(59.57% 0.0136 251.81) 48.4%, oklch(56.19% 0.0139 252.36) 51.6%, oklch(52.76% 0.0140 252.90) 54.8%, oklch(49.28% 0.0140 253.45) 58.1%, oklch(45.81% 0.0139 253.99) 61.3%, oklch(42.37% 0.0137 254.54) 64.5%, oklch(39.00% 0.0134 255.08) 67.7%, oklch(35.75% 0.0130 255.63) 71.0%, oklch(32.64% 0.0125 256.18) 74.2%, oklch(29.63% 0.0119 256.74) 77.4%, oklch(26.56% 0.0111 257.35) 80.6%, oklch(23.51% 0.0101 257.98) 83.9%, oklch(20.58% 0.0090 258.61) 87.1%, oklch(17.85% 0.0079 259.21) 90.3%, oklch(15.42% 0.0069 259.75) 93.5%, oklch(13.38% 0.0061 260.20) 96.8%, oklch(11.81% 0.0055 260.54) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.98 | 0.003 | 244.7 |
| 2 | 0.839 | 0.008 | 247.9 |
| 3 | 0.579 | 0.014 | 252.1 |
| 4 | 0.319 | 0.012 | 256.3 |
| 5 | 0.118 | 0.006 | 260.5 |

## In these collections

- [Silver gradients](https://grabient.com/silver-gradients)
- [Cool gray gradients](https://grabient.com/cool-gray-gradients)
- [Chrome gradients](https://grabient.com/chrome-gradients)

## Other forms

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