# Black to gray linear gradient

Black to gray linear gradient with 14 colors: #020202, #040404, #070708, #0a0b0c, #0d0f10, #111315, #151819, #1a1d1f, #202326, #272b2d, #2e3235, #3b4042, #575b5e, #707476. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kaFgCmEQDAJYBv-bgj_IwK_60DP_Ggj_g`
- Page: https://grabient.com/kaFgCmEQDAJYBv-bgj_IwK_60DP_Ggj_g?steps=14&angle=45
- Drawn as: linear gradient, 14 steps, 45 degrees
- Kinds: dark to light, neutral, dark
- Hues: achromatic
- Contrast of its darkest and lightest colors: 4.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 | `#020202` | `oklch(8.66% 0.0000 89.88)` | Black Hole | white, 20.7 to 1 |
| 2 | `#040404` | `oklch(10.57% 0.0005 234.39)` | Armour Wash | white, 20.5 to 1 |
| 3 | `#070708` | `oklch(13.04% 0.0012 235.45)` | Reversed Grey | white, 20.1 to 1 |
| 4 | `#0a0b0c` | `oklch(14.94% 0.0024 235.75)` | Raven | white, 19.6 to 1 |
| 5 | `#0d0f10` | `oklch(16.70% 0.0038 235.63)` | Chaos Black | white, 19.2 to 1 |
| 6 | `#111315` | `oklch(18.57% 0.0047 235.27)` | Cursed Black | white, 18.6 to 1 |
| 7 | `#151819` | `oklch(20.54% 0.0052 234.69)` | Dark Moon | white, 17.8 to 1 |
| 8 | `#1a1d1f` | `oklch(22.87% 0.0058 234.42)` | Satin Deep Black | white, 16.9 to 1 |
| 9 | `#202326` | `oklch(25.55% 0.0065 234.46)` | Verified Black | white, 15.7 to 1 |
| 10 | `#272b2d` | `oklch(28.54% 0.0071 234.49)` | Blue Charcoal | white, 14.3 to 1 |
| 11 | `#2e3235` | `oklch(31.43% 0.0080 234.49)` | Stiletto | white, 12.9 to 1 |
| 12 | `#3b4042` | `oklch(36.63% 0.0082 234.49)` | Dark Elf | white, 10.5 to 1 |
| 13 | `#575b5e` | `oklch(46.89% 0.0068 234.49)` | Iron Gate | white, 6.8 to 1 |
| 14 | `#707476` | `oklch(55.51% 0.0055 234.49)` | Battleship Grey | white, 4.7 to 1 |

## CSS

```css
background: linear-gradient(45deg, #020202 0.0%, #040404 7.7%, #070708 15.4%, #0a0b0c 23.1%, #0d0f10 30.8%, #111315 38.5%, #151819 46.2%, #1a1d1f 53.8%, #202326 61.5%, #272b2d 69.2%, #2e3235 76.9%, #3b4042 84.6%, #575b5e 92.3%, #707476 100.0%);
background: linear-gradient(45deg in oklch, oklch(8.66% 0.0000 89.88) 0.0%, oklch(10.57% 0.0005 234.39) 7.7%, oklch(13.04% 0.0012 235.45) 15.4%, oklch(14.94% 0.0024 235.75) 23.1%, oklch(16.70% 0.0038 235.63) 30.8%, oklch(18.57% 0.0047 235.27) 38.5%, oklch(20.54% 0.0052 234.69) 46.2%, oklch(22.87% 0.0058 234.42) 53.8%, oklch(25.55% 0.0065 234.46) 61.5%, oklch(28.54% 0.0071 234.49) 69.2%, oklch(31.43% 0.0080 234.49) 76.9%, oklch(36.63% 0.0082 234.49) 84.6%, oklch(46.89% 0.0068 234.49) 92.3%, oklch(55.51% 0.0055 234.49) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.087 | 0 | 233.4 |
| 2 | 0.134 | 0.001 | 235.6 |
| 3 | 0.173 | 0.004 | 235.6 |
| 4 | 0.217 | 0.006 | 234.5 |
| 5 | 0.276 | 0.007 | 234.5 |
| 6 | 0.354 | 0.008 | 234.5 |
| 7 | 0.555 | 0.006 | 234.5 |

## In these collections

- [Black gradients](https://grabient.com/black-gradients)

## Other forms

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