# Black to dark gray linear gradient

Black to dark gray linear gradient with 32 colors: #131418, #141519, #15161a, #17171b, #18191d, #1a1a1e, #1b1c20, #1d1e21, #1f1f23, #212125, #222326, #242528, #26272a, #28292c, #2a2a2d, #2b2c2f, #2c2d30, #2e2e31, #2f3033, #303134, #323236, #333437, #343538, #35363a, #37373b, #38383c, #39393d, #3a3a3e, #3b3b3f, #3b3c40, #3c3d41, #3d3d41. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kSMQbGJYI_q4CwC`
- Page: https://grabient.com/kSMQbGJYI_q4CwC?steps=32
- Drawn as: linear 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 | `#131418` | `oklch(19.29% 0.0083 278.44)` | Dark Void | white, 18.3 to 1 |
| 2 | `#141519` | `oklch(19.67% 0.0082 278.35)` | Dark Void | white, 18.2 to 1 |
| 3 | `#15161a` | `oklch(20.14% 0.0080 278.24)` | Piano Black | white, 18 to 1 |
| 4 | `#17171b` | `oklch(20.68% 0.0078 278.10)` | Piano Black | white, 17.8 to 1 |
| 5 | `#18191d` | `oklch(21.29% 0.0077 277.94)` | Aswad Black | white, 17.6 to 1 |
| 6 | `#1a1a1e` | `oklch(21.96% 0.0074 277.76)` | Gluon Grey | white, 17.3 to 1 |
| 7 | `#1b1c20` | `oklch(22.67% 0.0072 277.58)` | Satin Deep Black | white, 17 to 1 |
| 8 | `#1d1e21` | `oklch(23.42% 0.0070 277.39)` | Satin Deep Black | white, 16.7 to 1 |
| 9 | `#1f1f23` | `oklch(24.18% 0.0067 277.20)` | Inkwell Inception | white, 16.3 to 1 |
| 10 | `#212125` | `oklch(24.96% 0.0065 277.02)` | Noble Black | white, 16 to 1 |
| 11 | `#222326` | `oklch(25.74% 0.0063 276.85)` | Verified Black | white, 15.6 to 1 |
| 12 | `#242528` | `oklch(26.51% 0.0061 276.69)` | Black Beauty | white, 15.3 to 1 |
| 13 | `#26272a` | `oklch(27.25% 0.0059 276.56)` | Dire Wolf | white, 14.9 to 1 |
| 14 | `#28292c` | `oklch(27.97% 0.0058 276.45)` | Anthracite | white, 14.6 to 1 |
| 15 | `#2a2a2d` | `oklch(28.63% 0.0056 276.37)` | The End | white, 14.2 to 1 |
| 16 | `#2b2c2f` | `oklch(29.25% 0.0055 276.33)` | Caviar | white, 14 to 1 |
| 17 | `#2c2d30` | `oklch(29.80% 0.0055 276.33)` | Dark Onyx | white, 13.7 to 1 |
| 18 | `#2e2e31` | `oklch(30.34% 0.0055 276.37)` | Dark Onyx | white, 13.4 to 1 |
| 19 | `#2f3033` | `oklch(30.88% 0.0055 276.45)` | Tap Shoe | white, 13.2 to 1 |
| 20 | `#303134` | `oklch(31.41% 0.0056 276.56)` | Tap Shoe | white, 12.9 to 1 |
| 21 | `#323236` | `oklch(31.93% 0.0057 276.69)` | Stiletto | white, 12.7 to 1 |
| 22 | `#333437` | `oklch(32.44% 0.0058 276.85)` | Dark Kettle Black | white, 12.4 to 1 |
| 23 | `#343538` | `oklch(32.93% 0.0059 277.02)` | Dark Kettle Black | white, 12.2 to 1 |
| 24 | `#35363a` | `oklch(33.40% 0.0060 277.20)` | Hawk’s Eye | white, 12 to 1 |
| 25 | `#37373b` | `oklch(33.85% 0.0061 277.39)` | Vulcan | white, 11.8 to 1 |
| 26 | `#38383c` | `oklch(34.28% 0.0063 277.58)` | Vulcan | white, 11.6 to 1 |
| 27 | `#39393d` | `oklch(34.68% 0.0064 277.76)` | Artist’s Charcoal | white, 11.4 to 1 |
| 28 | `#3a3a3e` | `oklch(35.06% 0.0065 277.94)` | Moonless Night | white, 11.2 to 1 |
| 29 | `#3b3b3f` | `oklch(35.40% 0.0066 278.10)` | Coal Hard Truth | white, 11.1 to 1 |
| 30 | `#3b3c40` | `oklch(35.71% 0.0067 278.24)` | In the Dark | white, 11 to 1 |
| 31 | `#3c3d41` | `oklch(35.98% 0.0068 278.35)` | In the Dark | white, 10.8 to 1 |
| 32 | `#3d3d41` | `oklch(36.22% 0.0069 278.44)` | In the Dark | white, 10.7 to 1 |

## CSS

```css
background: linear-gradient(90deg, #131418 0.0%, #141519 3.2%, #15161a 6.5%, #17171b 9.7%, #18191d 12.9%, #1a1a1e 16.1%, #1b1c20 19.4%, #1d1e21 22.6%, #1f1f23 25.8%, #212125 29.0%, #222326 32.3%, #242528 35.5%, #26272a 38.7%, #28292c 41.9%, #2a2a2d 45.2%, #2b2c2f 48.4%, #2c2d30 51.6%, #2e2e31 54.8%, #2f3033 58.1%, #303134 61.3%, #323236 64.5%, #333437 67.7%, #343538 71.0%, #35363a 74.2%, #37373b 77.4%, #38383c 80.6%, #39393d 83.9%, #3a3a3e 87.1%, #3b3b3f 90.3%, #3b3c40 93.5%, #3c3d41 96.8%, #3d3d41 100.0%);
background: linear-gradient(90deg in oklch, oklch(19.29% 0.0083 278.44) 0.0%, oklch(19.67% 0.0082 278.35) 3.2%, oklch(20.14% 0.0080 278.24) 6.5%, oklch(20.68% 0.0078 278.10) 9.7%, oklch(21.29% 0.0077 277.94) 12.9%, oklch(21.96% 0.0074 277.76) 16.1%, oklch(22.67% 0.0072 277.58) 19.4%, oklch(23.42% 0.0070 277.39) 22.6%, oklch(24.18% 0.0067 277.20) 25.8%, oklch(24.96% 0.0065 277.02) 29.0%, oklch(25.74% 0.0063 276.85) 32.3%, oklch(26.51% 0.0061 276.69) 35.5%, oklch(27.25% 0.0059 276.56) 38.7%, oklch(27.97% 0.0058 276.45) 41.9%, oklch(28.63% 0.0056 276.37) 45.2%, oklch(29.25% 0.0055 276.33) 48.4%, oklch(29.80% 0.0055 276.33) 51.6%, oklch(30.34% 0.0055 276.37) 54.8%, oklch(30.88% 0.0055 276.45) 58.1%, oklch(31.41% 0.0056 276.56) 61.3%, oklch(31.93% 0.0057 276.69) 64.5%, oklch(32.44% 0.0058 276.85) 67.7%, oklch(32.93% 0.0059 277.02) 71.0%, oklch(33.40% 0.0060 277.20) 74.2%, oklch(33.85% 0.0061 277.39) 77.4%, oklch(34.28% 0.0063 277.58) 80.6%, oklch(34.68% 0.0064 277.76) 83.9%, oklch(35.06% 0.0065 277.94) 87.1%, oklch(35.40% 0.0066 278.10) 90.3%, oklch(35.71% 0.0067 278.24) 93.5%, oklch(35.98% 0.0068 278.35) 96.8%, oklch(36.22% 0.0069 278.44) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.193 | 0.008 | 278.4 |
| 2 | 0.295 | 0.006 | 276.3 |
| 3 | 0.362 | 0.007 | 278.4 |

## In these collections

- [Dark gradients](https://grabient.com/dark-gradients)

## Other forms

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