# Near-black, gray and off-white color palette

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

- Also called: Black, gray and white linear gradient
- Seed: `kSBQAAP4A__2AP-`
- Page: https://grabient.com/kSBQAAP4A__2AP-?steps=32
- Drawn as: linear gradient, 32 steps, 90 degrees
- Kinds: dark to light, neutral
- Hues: achromatic
- Contrast of its darkest and lightest colors: 20.2 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 | `#000000` | `oklch(1.97% 0.0000 89.88)` | Black | white, 20.9 to 1 |
| 2 | `#000000` | `oklch(3.71% 0.0000 89.88)` | Black | white, 20.9 to 1 |
| 3 | `#010101` | `oklch(5.81% 0.0000 89.88)` | Binary Black | white, 20.9 to 1 |
| 4 | `#020202` | `oklch(8.23% 0.0000 89.88)` | Black Hole | white, 20.7 to 1 |
| 5 | `#040404` | `oklch(10.93% 0.0000 89.88)` | Armour Wash | white, 20.4 to 1 |
| 6 | `#090909` | `oklch(13.88% 0.0000 89.88)` | Badab Black Wash | white, 19.9 to 1 |
| 7 | `#0f0f0f` | `oklch(17.03% 0.0000 89.88)` | Chaos Black | white, 19.1 to 1 |
| 8 | `#171717` | `oklch(20.35% 0.0000 89.88)` | Cynical Black | white, 17.9 to 1 |
| 9 | `#1f1f1f` | `oklch(23.81% 0.0000 89.88)` | Umbra | white, 16.5 to 1 |
| 10 | `#272727` | `oklch(27.35% 0.0000 89.88)` | Dire Wolf | white, 14.9 to 1 |
| 11 | `#303030` | `oklch(30.95% 0.0000 89.88)` | Off Black | white, 13.1 to 1 |
| 12 | `#393939` | `oklch(34.56% 0.0000 89.88)` | Boltgun Metal | white, 11.5 to 1 |
| 13 | `#434343` | `oklch(38.15% 0.0000 89.88)` | Black Suede | white, 9.9 to 1 |
| 14 | `#4c4c4c` | `oklch(41.68% 0.0000 89.88)` | Shady Character | white, 8.5 to 1 |
| 15 | `#555555` | `oklch(45.12% 0.0000 89.88)` | Stone Cold | white, 7.4 to 1 |
| 16 | `#5f5f5f` | `oklch(48.41% 0.0000 89.88)` | Shades On | white, 6.4 to 1 |
| 17 | `#686868` | `oklch(51.59% 0.0000 89.88)` | Shadow Gargoyle | white, 5.6 to 1 |
| 18 | `#717171` | `oklch(54.90% 0.0000 89.88)` | Dull | white, 4.8 to 1 |
| 19 | `#7b7b7b` | `oklch(58.36% 0.0000 89.88)` | Nature Walk | black, 4.9 to 1 |
| 20 | `#868686` | `oklch(61.93% 0.0000 89.88)` | Mithril | black, 5.7 to 1 |
| 21 | `#919191` | `oklch(65.58% 0.0000 89.88)` | Tin | black, 6.6 to 1 |
| 22 | `#9c9c9c` | `oklch(69.25% 0.0000 89.88)` | Codex Grey | black, 7.6 to 1 |
| 23 | `#a7a7a7` | `oklch(72.91% 0.0000 89.88)` | Moon Landing | black, 8.7 to 1 |
| 24 | `#b3b3b3` | `oklch(76.52% 0.0000 89.88)` | Silverstone | black, 9.9 to 1 |
| 25 | `#bebebe` | `oklch(80.04% 0.0000 89.88)` | Tin Soldier | black, 11.2 to 1 |
| 26 | `#c8c8c8` | `oklch(83.43% 0.0000 89.88)` | Brushed Metal | black, 12.6 to 1 |
| 27 | `#d3d3d3` | `oklch(86.66% 0.0000 89.88)` | Pinball | black, 14 to 1 |
| 28 | `#dddddd` | `oklch(89.67% 0.0000 89.88)` | Steam | black, 15.4 to 1 |
| 29 | `#e6e6e6` | `oklch(92.43% 0.0000 89.88)` | Extraordinary Abundance of Tinge | black, 16.7 to 1 |
| 30 | `#eeeeee` | `oklch(94.90% 0.0000 89.88)` | Super Silver | black, 18 to 1 |
| 31 | `#f5f5f5` | `oklch(97.05% 0.0000 89.88)` | White Smoke | black, 19.2 to 1 |
| 32 | `#fbfbfb` | `oklch(98.82% 0.0000 89.88)` | Whiteout | black, 20.2 to 1 |

## CSS

```css
background: linear-gradient(90deg, #000000 0.0%, #000000 3.2%, #010101 6.5%, #020202 9.7%, #040404 12.9%, #090909 16.1%, #0f0f0f 19.4%, #171717 22.6%, #1f1f1f 25.8%, #272727 29.0%, #303030 32.3%, #393939 35.5%, #434343 38.7%, #4c4c4c 41.9%, #555555 45.2%, #5f5f5f 48.4%, #686868 51.6%, #717171 54.8%, #7b7b7b 58.1%, #868686 61.3%, #919191 64.5%, #9c9c9c 67.7%, #a7a7a7 71.0%, #b3b3b3 74.2%, #bebebe 77.4%, #c8c8c8 80.6%, #d3d3d3 83.9%, #dddddd 87.1%, #e6e6e6 90.3%, #eeeeee 93.5%, #f5f5f5 96.8%, #fbfbfb 100.0%);
background: linear-gradient(90deg in oklch, oklch(1.97% 0.0000 89.88) 0.0%, oklch(3.71% 0.0000 89.88) 3.2%, oklch(5.81% 0.0000 89.88) 6.5%, oklch(8.23% 0.0000 89.88) 9.7%, oklch(10.93% 0.0000 89.88) 12.9%, oklch(13.88% 0.0000 89.88) 16.1%, oklch(17.03% 0.0000 89.88) 19.4%, oklch(20.35% 0.0000 89.88) 22.6%, oklch(23.81% 0.0000 89.88) 25.8%, oklch(27.35% 0.0000 89.88) 29.0%, oklch(30.95% 0.0000 89.88) 32.3%, oklch(34.56% 0.0000 89.88) 35.5%, oklch(38.15% 0.0000 89.88) 38.7%, oklch(41.68% 0.0000 89.88) 41.9%, oklch(45.12% 0.0000 89.88) 45.2%, oklch(48.41% 0.0000 89.88) 48.4%, oklch(51.59% 0.0000 89.88) 51.6%, oklch(54.90% 0.0000 89.88) 54.8%, oklch(58.36% 0.0000 89.88) 58.1%, oklch(61.93% 0.0000 89.88) 61.3%, oklch(65.58% 0.0000 89.88) 64.5%, oklch(69.25% 0.0000 89.88) 67.7%, oklch(72.91% 0.0000 89.88) 71.0%, oklch(76.52% 0.0000 89.88) 74.2%, oklch(80.04% 0.0000 89.88) 77.4%, oklch(83.43% 0.0000 89.88) 80.6%, oklch(86.66% 0.0000 89.88) 83.9%, oklch(89.67% 0.0000 89.88) 87.1%, oklch(92.43% 0.0000 89.88) 90.3%, oklch(94.90% 0.0000 89.88) 93.5%, oklch(97.05% 0.0000 89.88) 96.8%, oklch(98.82% 0.0000 89.88) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.02 | 0 | 0 |
| 2 | 0.5 | 0 | 0 |
| 3 | 0.988 | 0 | 0 |

## In these collections

- [Black and white gradients](https://grabient.com/black-and-white-gradients)
- [Silver color palette](https://grabient.com/silver-color-palette)

## Other forms

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