# Black to dark gray radial gradient

Black to dark gray radial gradient with 32 colors: #141318, #141418, #161519, #17161b, #18181c, #1a191e, #1c1b1f, #1d1d21, #1f1f23, #212025, #232226, #252428, #27262a, #29282c, #2a2a2e, #2c2b2f, #2d2d30, #2f2e32, #302f33, #323135, #333236, #343337, #353539, #37363a, #38373b, #39383c, #3a393d, #3b3a3e, #3c3b3f, #3c3c40, #3d3c41, #3e3d42. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kSMAfQpYLAK4DP8`
- Page: https://grabient.com/kSMAfQpYLAK4DP8?style=radialGradient&steps=32
- Drawn as: radial gradient, 32 steps, 90 degrees
- Kinds: neutral, dark
- Hues: achromatic
- Contrast of its darkest and lightest colors: 1.7 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 | `#141318` | `oklch(18.90% 0.0096 293.20)` | Kettle Black | white, 18.5 to 1 |
| 2 | `#141418` | `oklch(19.29% 0.0095 293.29)` | Dark Void | white, 18.3 to 1 |
| 3 | `#161519` | `oklch(19.78% 0.0094 293.40)` | Dark Void | white, 18.2 to 1 |
| 4 | `#17161b` | `oklch(20.35% 0.0092 293.53)` | Eigengrau | white, 17.9 to 1 |
| 5 | `#18181c` | `oklch(20.98% 0.0090 293.68)` | Aswad Black | white, 17.7 to 1 |
| 6 | `#1a191e` | `oklch(21.68% 0.0088 293.84)` | Aswad Black | white, 17.4 to 1 |
| 7 | `#1c1b1f` | `oklch(22.42% 0.0086 294.01)` | Gluon Grey | white, 17.1 to 1 |
| 8 | `#1d1d21` | `oklch(23.20% 0.0084 294.19)` | Satin Deep Black | white, 16.8 to 1 |
| 9 | `#1f1f23` | `oklch(24.00% 0.0081 294.37)` | Inkwell Inception | white, 16.4 to 1 |
| 10 | `#212025` | `oklch(24.81% 0.0079 294.55)` | Wet Charcoal | white, 16.1 to 1 |
| 11 | `#232226` | `oklch(25.61% 0.0077 294.71)` | Raisin Black | white, 15.7 to 1 |
| 12 | `#252428` | `oklch(26.41% 0.0075 294.87)` | Dark Gunmetal | white, 15.3 to 1 |
| 13 | `#27262a` | `oklch(27.18% 0.0073 295.01)` | Darth Vader | white, 15 to 1 |
| 14 | `#29282c` | `oklch(27.92% 0.0071 295.13)` | Anthracite | white, 14.6 to 1 |
| 15 | `#2a2a2e` | `oklch(28.61% 0.0070 295.23)` | Jaguar | white, 14.3 to 1 |
| 16 | `#2c2b2f` | `oklch(29.24% 0.0069 295.30)` | Caviar | white, 14 to 1 |
| 17 | `#2d2d30` | `oklch(29.81% 0.0069 295.33)` | Dark Onyx | white, 13.7 to 1 |
| 18 | `#2f2e32` | `oklch(30.36% 0.0069 295.34)` | Stretch Limo | white, 13.4 to 1 |
| 19 | `#302f33` | `oklch(30.90% 0.0069 295.31)` | Tap Shoe | white, 13.2 to 1 |
| 20 | `#323135` | `oklch(31.44% 0.0069 295.27)` | Stiletto | white, 12.9 to 1 |
| 21 | `#333236` | `oklch(31.96% 0.0070 295.21)` | Stiletto | white, 12.7 to 1 |
| 22 | `#343337` | `oklch(32.47% 0.0071 295.13)` | Jet Black | white, 12.4 to 1 |
| 23 | `#353539` | `oklch(32.95% 0.0072 295.04)` | Hawk’s Eye | white, 12.2 to 1 |
| 24 | `#37363a` | `oklch(33.42% 0.0074 294.95)` | Sayward Pine | white, 12 to 1 |
| 25 | `#38373b` | `oklch(33.87% 0.0075 294.84)` | Avocado Peel | white, 11.8 to 1 |
| 26 | `#39383c` | `oklch(34.30% 0.0076 294.74)` | Avocado Peel | white, 11.6 to 1 |
| 27 | `#3a393d` | `oklch(34.70% 0.0078 294.63)` | Moonless Night | white, 11.4 to 1 |
| 28 | `#3b3a3e` | `oklch(35.07% 0.0079 294.54)` | Moonless Night | white, 11.2 to 1 |
| 29 | `#3c3b3f` | `oklch(35.41% 0.0080 294.45)` | In the Dark | white, 11.1 to 1 |
| 30 | `#3c3c40` | `oklch(35.71% 0.0081 294.37)` | In the Dark | white, 11 to 1 |
| 31 | `#3d3c41` | `oklch(35.99% 0.0082 294.30)` | In the Dark | white, 10.8 to 1 |
| 32 | `#3e3d42` | `oklch(36.22% 0.0083 294.26)` | Tuxedo | white, 10.7 to 1 |

## CSS

```css
background: radial-gradient(circle at 50% 50%, #141318 0.0%, #141418 3.2%, #161519 6.5%, #17161b 9.7%, #18181c 12.9%, #1a191e 16.1%, #1c1b1f 19.4%, #1d1d21 22.6%, #1f1f23 25.8%, #212025 29.0%, #232226 32.3%, #252428 35.5%, #27262a 38.7%, #29282c 41.9%, #2a2a2e 45.2%, #2c2b2f 48.4%, #2d2d30 51.6%, #2f2e32 54.8%, #302f33 58.1%, #323135 61.3%, #333236 64.5%, #343337 67.7%, #353539 71.0%, #37363a 74.2%, #38373b 77.4%, #39383c 80.6%, #3a393d 83.9%, #3b3a3e 87.1%, #3c3b3f 90.3%, #3c3c40 93.5%, #3d3c41 96.8%, #3e3d42 100.0%);
background: radial-gradient(circle at 50% 50% in oklch, oklch(18.90% 0.0096 293.20) 0.0%, oklch(19.29% 0.0095 293.29) 3.2%, oklch(19.78% 0.0094 293.40) 6.5%, oklch(20.35% 0.0092 293.53) 9.7%, oklch(20.98% 0.0090 293.68) 12.9%, oklch(21.68% 0.0088 293.84) 16.1%, oklch(22.42% 0.0086 294.01) 19.4%, oklch(23.20% 0.0084 294.19) 22.6%, oklch(24.00% 0.0081 294.37) 25.8%, oklch(24.81% 0.0079 294.55) 29.0%, oklch(25.61% 0.0077 294.71) 32.3%, oklch(26.41% 0.0075 294.87) 35.5%, oklch(27.18% 0.0073 295.01) 38.7%, oklch(27.92% 0.0071 295.13) 41.9%, oklch(28.61% 0.0070 295.23) 45.2%, oklch(29.24% 0.0069 295.30) 48.4%, oklch(29.81% 0.0069 295.33) 51.6%, oklch(30.36% 0.0069 295.34) 54.8%, oklch(30.90% 0.0069 295.31) 58.1%, oklch(31.44% 0.0069 295.27) 61.3%, oklch(31.96% 0.0070 295.21) 64.5%, oklch(32.47% 0.0071 295.13) 67.7%, oklch(32.95% 0.0072 295.04) 71.0%, oklch(33.42% 0.0074 294.95) 74.2%, oklch(33.87% 0.0075 294.84) 77.4%, oklch(34.30% 0.0076 294.74) 80.6%, oklch(34.70% 0.0078 294.63) 83.9%, oklch(35.07% 0.0079 294.54) 87.1%, oklch(35.41% 0.0080 294.45) 90.3%, oklch(35.71% 0.0081 294.37) 93.5%, oklch(35.99% 0.0082 294.30) 96.8%, oklch(36.22% 0.0083 294.26) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.189 | 0.01 | 293.2 |
| 2 | 0.295 | 0.007 | 295.3 |
| 3 | 0.362 | 0.008 | 294.3 |

## In these collections

- [Gray gradients](https://grabient.com/gray-gradients)

## Other forms

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