# Near-black and gray black palette

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

- Also called: Black to gray linear gradient
- Seed: `kaFgCmEQDAJYBv-bgj_IwK_60DP_Ggj_g`
- Page: https://grabient.com/kaFgCmEQDAJYBv-bgj_IwK_60DP_Ggj_g?steps=32&angle=45
- Drawn as: linear gradient, 32 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 | `#030303` | `oklch(9.29% 0.0002 233.74)` | Armour Wash | white, 20.6 to 1 |
| 3 | `#030304` | `oklch(10.18% 0.0004 234.20)` | Armour Wash | white, 20.5 to 1 |
| 4 | `#050505` | `oklch(11.22% 0.0006 234.71)` | Black Metal | white, 20.4 to 1 |
| 5 | `#060606` | `oklch(12.28% 0.0009 235.17)` | Black Metal | white, 20.2 to 1 |
| 6 | `#070808` | `oklch(13.24% 0.0013 235.51)` | Reversed Grey | white, 20 to 1 |
| 7 | `#09090a` | `oklch(14.06% 0.0018 235.68)` | Badab Black Wash | white, 19.8 to 1 |
| 8 | `#0a0b0c` | `oklch(14.82% 0.0023 235.75)` | Raven | white, 19.7 to 1 |
| 9 | `#0b0d0d` | `oklch(15.56% 0.0029 235.74)` | Black Wash | white, 19.5 to 1 |
| 10 | `#0c0e0f` | `oklch(16.30% 0.0035 235.68)` | Black Sheep | white, 19.3 to 1 |
| 11 | `#0e1011` | `oklch(17.06% 0.0040 235.58)` | Ruined Smores | white, 19 to 1 |
| 12 | `#0f1213` | `oklch(17.85% 0.0044 235.46)` | Dreamless Sleep | white, 18.8 to 1 |
| 13 | `#111315` | `oklch(18.64% 0.0047 235.25)` | Cursed Black | white, 18.5 to 1 |
| 14 | `#131517` | `oklch(19.43% 0.0049 235.00)` | Dark Void | white, 18.3 to 1 |
| 15 | `#141719` | `oklch(20.27% 0.0052 234.76)` | Dark Moon | white, 17.9 to 1 |
| 16 | `#16191b` | `oklch(21.17% 0.0054 234.56)` | Aswad Black | white, 17.6 to 1 |
| 17 | `#181b1d` | `oklch(22.15% 0.0056 234.45)` | Gluon Grey | white, 17.2 to 1 |
| 18 | `#1b1e20` | `oklch(23.19% 0.0059 234.42)` | Satin Deep Black | white, 16.7 to 1 |
| 19 | `#1d2022` | `oklch(24.29% 0.0062 234.43)` | Inkwell Inception | white, 16.3 to 1 |
| 20 | `#202325` | `oklch(25.45% 0.0064 234.46)` | Verified Black | white, 15.7 to 1 |
| 21 | `#232628` | `oklch(26.69% 0.0067 234.49)` | Black Beauty | white, 15.1 to 1 |
| 22 | `#26292c` | `oklch(27.99% 0.0070 234.49)` | Graphite Black | white, 14.5 to 1 |
| 23 | `#282c2f` | `oklch(29.15% 0.0073 234.49)` | Bunker | white, 14 to 1 |
| 24 | `#2b2f32` | `oklch(30.30% 0.0077 234.49)` | Cod Grey | white, 13.4 to 1 |
| 25 | `#2e3336` | `oklch(31.66% 0.0081 234.49)` | Ebony | white, 12.8 to 1 |
| 26 | `#33373a` | `oklch(33.45% 0.0083 234.49)` | Tribecca Corner | white, 11.9 to 1 |
| 27 | `#393e41` | `oklch(35.91% 0.0082 234.49)` | Mine Shaft | white, 10.8 to 1 |
| 28 | `#43474a` | `oklch(39.54% 0.0079 234.49)` | Little Black Dress | white, 9.3 to 1 |
| 29 | `#4f5356` | `oklch(44.02% 0.0073 234.49)` | Trout | white, 7.7 to 1 |
| 30 | `#5c6063` | `oklch(48.64% 0.0066 234.49)` | Sheet Metal | white, 6.3 to 1 |
| 31 | `#686c6e` | `oklch(52.70% 0.0059 234.49)` | Liberty Bell Grey | white, 5.3 to 1 |
| 32 | `#707476` | `oklch(55.51% 0.0055 234.49)` | Battleship Grey | white, 4.7 to 1 |

## CSS

```css
background: linear-gradient(45deg, #020202 0.0%, #030303 3.2%, #030304 6.5%, #050505 9.7%, #060606 12.9%, #070808 16.1%, #09090a 19.4%, #0a0b0c 22.6%, #0b0d0d 25.8%, #0c0e0f 29.0%, #0e1011 32.3%, #0f1213 35.5%, #111315 38.7%, #131517 41.9%, #141719 45.2%, #16191b 48.4%, #181b1d 51.6%, #1b1e20 54.8%, #1d2022 58.1%, #202325 61.3%, #232628 64.5%, #26292c 67.7%, #282c2f 71.0%, #2b2f32 74.2%, #2e3336 77.4%, #33373a 80.6%, #393e41 83.9%, #43474a 87.1%, #4f5356 90.3%, #5c6063 93.5%, #686c6e 96.8%, #707476 100.0%);
background: linear-gradient(45deg in oklch, oklch(8.66% 0.0000 89.88) 0.0%, oklch(9.29% 0.0002 233.74) 3.2%, oklch(10.18% 0.0004 234.20) 6.5%, oklch(11.22% 0.0006 234.71) 9.7%, oklch(12.28% 0.0009 235.17) 12.9%, oklch(13.24% 0.0013 235.51) 16.1%, oklch(14.06% 0.0018 235.68) 19.4%, oklch(14.82% 0.0023 235.75) 22.6%, oklch(15.56% 0.0029 235.74) 25.8%, oklch(16.30% 0.0035 235.68) 29.0%, oklch(17.06% 0.0040 235.58) 32.3%, oklch(17.85% 0.0044 235.46) 35.5%, oklch(18.64% 0.0047 235.25) 38.7%, oklch(19.43% 0.0049 235.00) 41.9%, oklch(20.27% 0.0052 234.76) 45.2%, oklch(21.17% 0.0054 234.56) 48.4%, oklch(22.15% 0.0056 234.45) 51.6%, oklch(23.19% 0.0059 234.42) 54.8%, oklch(24.29% 0.0062 234.43) 58.1%, oklch(25.45% 0.0064 234.46) 61.3%, oklch(26.69% 0.0067 234.49) 64.5%, oklch(27.99% 0.0070 234.49) 67.7%, oklch(29.15% 0.0073 234.49) 71.0%, oklch(30.30% 0.0077 234.49) 74.2%, oklch(31.66% 0.0081 234.49) 77.4%, oklch(33.45% 0.0083 234.49) 80.6%, oklch(35.91% 0.0082 234.49) 83.9%, oklch(39.54% 0.0079 234.49) 87.1%, oklch(44.02% 0.0073 234.49) 90.3%, oklch(48.64% 0.0066 234.49) 93.5%, oklch(52.70% 0.0059 234.49) 96.8%, 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=32&angle=45)
- [PNG](https://grabient.com/kaFgCmEQDAJYBv-bgj_IwK_60DP_Ggj_g.png?steps=32&angle=45)
- [SVG](https://grabient.com/kaFgCmEQDAJYBv-bgj_IwK_60DP_Ggj_g.svg?steps=32&angle=45)
- [CSS](https://grabient.com/kaFgCmEQDAJYBv-bgj_IwK_60DP_Ggj_g.css?steps=32&angle=45)
- [ASE](https://grabient.com/kaFgCmEQDAJYBv-bgj_IwK_60DP_Ggj_g.ase?steps=32&angle=45)
- [GPL](https://grabient.com/kaFgCmEQDAJYBv-bgj_IwK_60DP_Ggj_g.gpl?steps=32&angle=45)
- [GRD](https://grabient.com/kaFgCmEQDAJYBv-bgj_IwK_60DP_Ggj_g.grd?steps=32&angle=45)
- [Design tokens](https://grabient.com/kaFgCmEQDAJYBv-bgj_IwK_60DP_Ggj_g.tokens.json?steps=32&angle=45)
- [Social card](https://grabient.com/api/og?seed=kaFgCmEQDAJYBv-bgj_IwK_60DP_Ggj_g&steps=32&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)
