# Black to dark gray linear gradient

Black to dark gray linear gradient with 32 colors: #07080c, #08080d, #09090e, #0a0b0f, #0b0c10, #0d0e11, #0e0f13, #101115, #121316, #141518, #16171a, #18181c, #1a1a1d, #1c1c1f, #1d1e21, #1f1f22, #202124, #222225, #232326, #242528, #262629, #27272b, #28292c, #292a2d, #2a2b2f, #2b2c30, #2d2d31, #2d2e32, #2e2f33, #2f3034, #303135, #303136. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kSIgfFHwJACgDQA`
- Page: https://grabient.com/kSIgfFHwJACgDQA?steps=32&angle=180
- Drawn as: linear gradient, 32 steps, 180 degrees
- Kinds: neutral, dark
- Hues: achromatic
- Contrast of its darkest and lightest colors: 1.5 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 | `#07080c` | `oklch(13.39% 0.0096 277.03)` | Reversed Grey | white, 20 to 1 |
| 2 | `#08080d` | `oklch(13.79% 0.0095 277.07)` | Reversed Grey | white, 19.9 to 1 |
| 3 | `#09090e` | `oklch(14.30% 0.0093 277.12)` | Existential Angst | white, 19.8 to 1 |
| 4 | `#0a0b0f` | `oklch(14.89% 0.0090 277.17)` | Raven | white, 19.7 to 1 |
| 5 | `#0b0c10` | `oklch(15.54% 0.0087 277.23)` | Black Wash | white, 19.5 to 1 |
| 6 | `#0d0e11` | `oklch(16.26% 0.0084 277.29)` | Chaos Black | white, 19.3 to 1 |
| 7 | `#0e0f13` | `oklch(17.03% 0.0080 277.36)` | Ruined Smores | white, 19.1 to 1 |
| 8 | `#101115` | `oklch(17.84% 0.0077 277.44)` | Ruined Smores | white, 18.8 to 1 |
| 9 | `#121316` | `oklch(18.66% 0.0073 277.51)` | Kettle Black | white, 18.5 to 1 |
| 10 | `#141518` | `oklch(19.50% 0.0070 277.59)` | Dark Void | white, 18.2 to 1 |
| 11 | `#16171a` | `oklch(20.34% 0.0066 277.67)` | Piano Black | white, 17.9 to 1 |
| 12 | `#18181c` | `oklch(21.17% 0.0063 277.75)` | Aswad Black | white, 17.6 to 1 |
| 13 | `#1a1a1d` | `oklch(21.97% 0.0061 277.83)` | Gluon Grey | white, 17.3 to 1 |
| 14 | `#1c1c1f` | `oklch(22.73% 0.0058 277.91)` | Dynamic Black | white, 17 to 1 |
| 15 | `#1d1e21` | `oklch(23.45% 0.0057 277.98)` | Satin Deep Black | white, 16.7 to 1 |
| 16 | `#1f1f22` | `oklch(24.11% 0.0055 278.05)` | Inkwell Inception | white, 16.4 to 1 |
| 17 | `#202124` | `oklch(24.70% 0.0055 278.12)` | Noble Black | white, 16.1 to 1 |
| 18 | `#222225` | `oklch(25.28% 0.0055 278.19)` | Raisin Black | white, 15.8 to 1 |
| 19 | `#232326` | `oklch(25.85% 0.0056 278.27)` | Verified Black | white, 15.6 to 1 |
| 20 | `#242528` | `oklch(26.42% 0.0057 278.35)` | Black Beauty | white, 15.3 to 1 |
| 21 | `#262629` | `oklch(26.97% 0.0059 278.43)` | Darth Vader | white, 15 to 1 |
| 22 | `#27272b` | `oklch(27.50% 0.0061 278.51)` | Anthracite | white, 14.8 to 1 |
| 23 | `#28292c` | `oklch(28.02% 0.0063 278.59)` | Anthracite | white, 14.5 to 1 |
| 24 | `#292a2d` | `oklch(28.52% 0.0066 278.66)` | The End | white, 14.3 to 1 |
| 25 | `#2a2b2f` | `oklch(29.00% 0.0068 278.74)` | Bunker | white, 14.1 to 1 |
| 26 | `#2b2c30` | `oklch(29.45% 0.0071 278.81)` | Caviar | white, 13.9 to 1 |
| 27 | `#2d2d31` | `oklch(29.87% 0.0073 278.88)` | Dark Onyx | white, 13.7 to 1 |
| 28 | `#2d2e32` | `oklch(30.27% 0.0076 278.95)` | Stretch Limo | white, 13.5 to 1 |
| 29 | `#2e2f33` | `oklch(30.63% 0.0078 279.01)` | Black Cat | white, 13.3 to 1 |
| 30 | `#2f3034` | `oklch(30.96% 0.0080 279.06)` | Tap Shoe | white, 13.1 to 1 |
| 31 | `#303135` | `oklch(31.25% 0.0082 279.11)` | Stiletto | white, 13 to 1 |
| 32 | `#303136` | `oklch(31.50% 0.0083 279.14)` | Smiler’s Mist | white, 12.9 to 1 |

## CSS

```css
background: linear-gradient(180deg, #07080c 0.0%, #08080d 3.2%, #09090e 6.5%, #0a0b0f 9.7%, #0b0c10 12.9%, #0d0e11 16.1%, #0e0f13 19.4%, #101115 22.6%, #121316 25.8%, #141518 29.0%, #16171a 32.3%, #18181c 35.5%, #1a1a1d 38.7%, #1c1c1f 41.9%, #1d1e21 45.2%, #1f1f22 48.4%, #202124 51.6%, #222225 54.8%, #232326 58.1%, #242528 61.3%, #262629 64.5%, #27272b 67.7%, #28292c 71.0%, #292a2d 74.2%, #2a2b2f 77.4%, #2b2c30 80.6%, #2d2d31 83.9%, #2d2e32 87.1%, #2e2f33 90.3%, #2f3034 93.5%, #303135 96.8%, #303136 100.0%);
background: linear-gradient(180deg in oklch, oklch(13.39% 0.0096 277.03) 0.0%, oklch(13.79% 0.0095 277.07) 3.2%, oklch(14.30% 0.0093 277.12) 6.5%, oklch(14.89% 0.0090 277.17) 9.7%, oklch(15.54% 0.0087 277.23) 12.9%, oklch(16.26% 0.0084 277.29) 16.1%, oklch(17.03% 0.0080 277.36) 19.4%, oklch(17.84% 0.0077 277.44) 22.6%, oklch(18.66% 0.0073 277.51) 25.8%, oklch(19.50% 0.0070 277.59) 29.0%, oklch(20.34% 0.0066 277.67) 32.3%, oklch(21.17% 0.0063 277.75) 35.5%, oklch(21.97% 0.0061 277.83) 38.7%, oklch(22.73% 0.0058 277.91) 41.9%, oklch(23.45% 0.0057 277.98) 45.2%, oklch(24.11% 0.0055 278.05) 48.4%, oklch(24.70% 0.0055 278.12) 51.6%, oklch(25.28% 0.0055 278.19) 54.8%, oklch(25.85% 0.0056 278.27) 58.1%, oklch(26.42% 0.0057 278.35) 61.3%, oklch(26.97% 0.0059 278.43) 64.5%, oklch(27.50% 0.0061 278.51) 67.7%, oklch(28.02% 0.0063 278.59) 71.0%, oklch(28.52% 0.0066 278.66) 74.2%, oklch(29.00% 0.0068 278.74) 77.4%, oklch(29.45% 0.0071 278.81) 80.6%, oklch(29.87% 0.0073 278.88) 83.9%, oklch(30.27% 0.0076 278.95) 87.1%, oklch(30.63% 0.0078 279.01) 90.3%, oklch(30.96% 0.0080 279.06) 93.5%, oklch(31.25% 0.0082 279.11) 96.8%, oklch(31.50% 0.0083 279.14) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.134 | 0.01 | 277 |
| 2 | 0.244 | 0.006 | 278.1 |
| 3 | 0.315 | 0.008 | 279.1 |

## In these collections

- [Night sky gradients](https://grabient.com/night-sky-gradients)
- [Dark mode UI gradients](https://grabient.com/dark-mode-ui-gradients)

## Other forms

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