# White charcoal return gradient

White, gray and dark gray linear gradient with 32 colors: #f8f8f8, #f1f1f1, #e8e8e8, #dddddd, #d0d0d0, #c3c3c3, #b5b5b5, #a7a7a7, #989898, #878787, #747474, #606060, #4d4d4d, #3d3d3d, #303030, #282828, #262626, #2a2a2a, #313131, #3b3b3b, #484848, #575757, #666666, #747474, #828282, #929292, #a3a3a3, #b4b4b4, #c6c6c6, #d6d6d6, #e4e4e4, #eeeeee. Edit it and copy or download CSS, SVG, PNG or shader code.

- Also called: White, gray and dark gray linear gradient
- Seed: `kW-QBAWAA_6KAP_IgD_-IA_4`
- Page: https://grabient.com/kW-QBAWAA_6KAP_IgD_-IA_4?steps=32&angle=135
- Drawn as: linear gradient, 32 steps, 135 degrees
- Kinds: dark center, neutral
- Hues: achromatic
- Contrast of its darkest and lightest colors: 14.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 | `#f8f8f8` | `oklch(98.03% 0.0000 89.88)` | Zhēn Zhū Bái Pearl | black, 19.8 to 1 |
| 2 | `#f1f1f1` | `oklch(95.83% 0.0000 89.88)` | Precious Pearls | black, 18.5 to 1 |
| 3 | `#e8e8e8` | `oklch(92.99% 0.0000 89.88)` | Unicorn Silver | black, 17 to 1 |
| 4 | `#dddddd` | `oklch(89.61% 0.0000 89.88)` | Steam | black, 15.3 to 1 |
| 5 | `#d0d0d0` | `oklch(85.80% 0.0000 89.88)` | Ancestral Water | black, 13.6 to 1 |
| 6 | `#c3c3c3` | `oklch(81.65% 0.0000 89.88)` | Explosive Grey | black, 11.8 to 1 |
| 7 | `#b5b5b5` | `oklch(77.25% 0.0000 89.88)` | Brainstem Grey | black, 10.2 to 1 |
| 8 | `#a7a7a7` | `oklch(72.72% 0.0000 89.88)` | Moon Landing | black, 8.6 to 1 |
| 9 | `#989898` | `oklch(68.10% 0.0000 89.88)` | Spanish Grey | black, 7.3 to 1 |
| 10 | `#878787` | `oklch(62.47% 0.0000 89.88)` | Mithril | black, 5.8 to 1 |
| 11 | `#747474` | `oklch(55.89% 0.0000 89.88)` | Bank Vault | white, 4.6 to 1 |
| 12 | `#606060` | `oklch(48.89% 0.0000 89.88)` | Kettleman | white, 6.2 to 1 |
| 13 | `#4d4d4d` | `oklch(42.05% 0.0000 89.88)` | Thunder | white, 8.4 to 1 |
| 14 | `#3d3d3d` | `oklch(35.89% 0.0000 89.88)` | Raven Black | white, 10.9 to 1 |
| 15 | `#303030` | `oklch(30.99% 0.0000 89.88)` | Off Black | white, 13.1 to 1 |
| 16 | `#282828` | `oklch(27.88% 0.0000 89.88)` | Dire Wolf | white, 14.6 to 1 |
| 17 | `#262626` | `oklch(27.05% 0.0000 89.88)` | Nero | white, 15 to 1 |
| 18 | `#2a2a2a` | `oklch(28.30% 0.0000 89.88)` | The End | white, 14.4 to 1 |
| 19 | `#313131` | `oklch(31.21% 0.0000 89.88)` | Tomcat | white, 13 to 1 |
| 20 | `#3b3b3b` | `oklch(35.35% 0.0000 89.88)` | Black Liquorice | white, 11.1 to 1 |
| 21 | `#484848` | `oklch(40.30% 0.0000 89.88)` | Pig Iron | white, 9 to 1 |
| 22 | `#575757` | `oklch(45.67% 0.0000 89.88)` | Shadow Mountain | white, 7.2 to 1 |
| 23 | `#666666` | `oklch(51.03% 0.0000 89.88)` | Cursed Grey | white, 5.7 to 1 |
| 24 | `#747474` | `oklch(55.97% 0.0000 89.88)` | Bank Vault | white, 4.6 to 1 |
| 25 | `#828282` | `oklch(60.59% 0.0000 89.88)` | Squant | black, 5.4 to 1 |
| 26 | `#929292` | `oklch(65.83% 0.0000 89.88)` | Nickel | black, 6.7 to 1 |
| 27 | `#a3a3a3` | `oklch(71.45% 0.0000 89.88)` | Grey of Darkness | black, 8.2 to 1 |
| 28 | `#b4b4b4` | `oklch(77.15% 0.0000 89.88)` | Brainstem Grey | black, 10.1 to 1 |
| 29 | `#c6c6c6` | `oklch(82.64% 0.0000 89.88)` | Silver Polish | black, 12.2 to 1 |
| 30 | `#d6d6d6` | `oklch(87.62% 0.0000 89.88)` | Silver Medal | black, 14.4 to 1 |
| 31 | `#e4e4e4` | `oklch(91.80% 0.0000 89.88)` | Titanium White | black, 16.4 to 1 |
| 32 | `#eeeeee` | `oklch(94.88% 0.0000 89.88)` | Super Silver | black, 18 to 1 |

## CSS

```css
background: linear-gradient(135deg, #f8f8f8 0.0%, #f1f1f1 3.2%, #e8e8e8 6.5%, #dddddd 9.7%, #d0d0d0 12.9%, #c3c3c3 16.1%, #b5b5b5 19.4%, #a7a7a7 22.6%, #989898 25.8%, #878787 29.0%, #747474 32.3%, #606060 35.5%, #4d4d4d 38.7%, #3d3d3d 41.9%, #303030 45.2%, #282828 48.4%, #262626 51.6%, #2a2a2a 54.8%, #313131 58.1%, #3b3b3b 61.3%, #484848 64.5%, #575757 67.7%, #666666 71.0%, #747474 74.2%, #828282 77.4%, #929292 80.6%, #a3a3a3 83.9%, #b4b4b4 87.1%, #c6c6c6 90.3%, #d6d6d6 93.5%, #e4e4e4 96.8%, #eeeeee 100.0%);
background: linear-gradient(135deg in oklch, oklch(98.03% 0.0000 89.88) 0.0%, oklch(95.83% 0.0000 89.88) 3.2%, oklch(92.99% 0.0000 89.88) 6.5%, oklch(89.61% 0.0000 89.88) 9.7%, oklch(85.80% 0.0000 89.88) 12.9%, oklch(81.65% 0.0000 89.88) 16.1%, oklch(77.25% 0.0000 89.88) 19.4%, oklch(72.72% 0.0000 89.88) 22.6%, oklch(68.10% 0.0000 89.88) 25.8%, oklch(62.47% 0.0000 89.88) 29.0%, oklch(55.89% 0.0000 89.88) 32.3%, oklch(48.89% 0.0000 89.88) 35.5%, oklch(42.05% 0.0000 89.88) 38.7%, oklch(35.89% 0.0000 89.88) 41.9%, oklch(30.99% 0.0000 89.88) 45.2%, oklch(27.88% 0.0000 89.88) 48.4%, oklch(27.05% 0.0000 89.88) 51.6%, oklch(28.30% 0.0000 89.88) 54.8%, oklch(31.21% 0.0000 89.88) 58.1%, oklch(35.35% 0.0000 89.88) 61.3%, oklch(40.30% 0.0000 89.88) 64.5%, oklch(45.67% 0.0000 89.88) 67.7%, oklch(51.03% 0.0000 89.88) 71.0%, oklch(55.97% 0.0000 89.88) 74.2%, oklch(60.59% 0.0000 89.88) 77.4%, oklch(65.83% 0.0000 89.88) 80.6%, oklch(71.45% 0.0000 89.88) 83.9%, oklch(77.15% 0.0000 89.88) 87.1%, oklch(82.64% 0.0000 89.88) 90.3%, oklch(87.62% 0.0000 89.88) 93.5%, oklch(91.80% 0.0000 89.88) 96.8%, oklch(94.88% 0.0000 89.88) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.98 | 0 | 90 |
| 2 | 0.693 | 0 | 90 |
| 3 | 0.272 | 0 | 90 |
| 4 | 0.571 | 0 | 90 |
| 5 | 0.949 | 0 | 90 |

## In these collections

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

## Other forms

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