# Silver mist over charcoal

Black to gray linear gradient with 32 colors: #212429, #272a2f, #2f3237, #383b40, #43464b, #4f5357, #5c6065, #6b6e73, #7a7d81, #898d90, #989c9f, #a7aaae, #b5b9bc, #c2c6c9, #ced1d4, #d8dbde, #dfe2e6, #e5e9ec, #eaedf1, #eef1f6, #f1f4f9, #f3f6fb, #f4f7fd, #f5f7fe, #f6f7ff, #f6f6ff, #f6f6ff, #f6f5ff, #f6f4fe, #f6f4fe, #f7f3fe, #f8f4ff. Edit it and copy or download CSS, SVG, PNG or shader code.

- Also called: Black to gray linear gradient
- Seed: `kSQgi58oI-fuFxm`
- Page: https://grabient.com/kSQgi58oI-fuFxm?steps=32&angle=45
- Drawn as: linear gradient, 32 steps, 45 degrees
- Kinds: dark to light, neutral, light
- Hues: achromatic
- Contrast of its darkest and lightest colors: 14.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 | `#212429` | `oklch(25.98% 0.0110 260.86)` | Dark Gunmetal | white, 15.5 to 1 |
| 2 | `#272a2f` | `oklch(28.42% 0.0108 260.27)` | Blue Charcoal | white, 14.3 to 1 |
| 3 | `#2f3237` | `oklch(31.54% 0.0105 259.35)` | Granite Black | white, 12.9 to 1 |
| 4 | `#383b40` | `oklch(35.23% 0.0101 258.18)` | Crypt | white, 11.1 to 1 |
| 5 | `#43464b` | `oklch(39.40% 0.0096 256.82)` | Steel Grey | white, 9.4 to 1 |
| 6 | `#4f5357` | `oklch(43.95% 0.0091 255.32)` | Trout | white, 7.7 to 1 |
| 7 | `#5c6065` | `oklch(48.78% 0.0086 253.77)` | Sheet Metal | white, 6.3 to 1 |
| 8 | `#6b6e73` | `oklch(53.80% 0.0081 252.21)` | Bottlenose Dolphin | white, 5 to 1 |
| 9 | `#7a7d81` | `oklch(58.91% 0.0075 250.72)` | Cowboy Spur | black, 5 to 1 |
| 10 | `#898d90` | `oklch(64.01% 0.0070 249.36)` | Ancient Pewter | black, 6.2 to 1 |
| 11 | `#989c9f` | `oklch(69.00% 0.0066 248.20)` | Harrison Grey | black, 7.5 to 1 |
| 12 | `#a7aaae` | `oklch(73.78% 0.0062 247.29)` | Chrome Aluminium | black, 9 to 1 |
| 13 | `#b5b9bc` | `oklch(78.26% 0.0058 246.72)` | Let It Rain | black, 10.5 to 1 |
| 14 | `#c2c6c9` | `oklch(82.35% 0.0056 246.53)` | Weathered Stone | black, 12.1 to 1 |
| 15 | `#ced1d4` | `oklch(85.93% 0.0055 246.79)` | Fragile Blue | black, 13.6 to 1 |
| 16 | `#d8dbde` | `oklch(88.92% 0.0055 247.57)` | Empire State Grey | black, 15 to 1 |
| 17 | `#dfe2e6` | `oklch(91.25% 0.0056 248.96)` | January Dawn | black, 16.2 to 1 |
| 18 | `#e5e9ec` | `oklch(93.13% 0.0059 251.06)` | Snow Cloud | black, 17.1 to 1 |
| 19 | `#eaedf1` | `oklch(94.62% 0.0063 253.80)` | Walls of Santorini | black, 17.9 to 1 |
| 20 | `#eef1f6` | `oklch(95.76% 0.0069 257.09)` | Airport | black, 18.5 to 1 |
| 21 | `#f1f4f9` | `oklch(96.60% 0.0075 260.83)` | Child of Light | black, 19 to 1 |
| 22 | `#f3f6fb` | `oklch(97.18% 0.0082 264.91)` | White Solid | black, 19.3 to 1 |
| 23 | `#f4f7fd` | `oklch(97.53% 0.0090 269.25)` | Mā White | black, 19.5 to 1 |
| 24 | `#f5f7fe` | `oklch(97.69% 0.0098 273.73)` | Mā White | black, 19.6 to 1 |
| 25 | `#f6f7ff` | `oklch(97.72% 0.0106 278.26)` | Ghost White | black, 19.6 to 1 |
| 26 | `#f6f6ff` | `oklch(97.64% 0.0114 282.74)` | Mā White | black, 19.5 to 1 |
| 27 | `#f6f6ff` | `oklch(97.49% 0.0122 287.09)` | Mā White | black, 19.4 to 1 |
| 28 | `#f6f5ff` | `oklch(97.33% 0.0130 291.18)` | Sugar Crystal | black, 19.3 to 1 |
| 29 | `#f6f4fe` | `oklch(97.18% 0.0137 294.93)` | Sugar Crystal | black, 19.3 to 1 |
| 30 | `#f6f4fe` | `oklch(97.09% 0.0143 298.24)` | Sugar Crystal | black, 19.2 to 1 |
| 31 | `#f7f3fe` | `oklch(97.10% 0.0148 301.00)` | Sugar Crystal | black, 19.2 to 1 |
| 32 | `#f8f4ff` | `oklch(97.24% 0.0152 303.13)` | Sugar Crystal | black, 19.3 to 1 |

## CSS

```css
background: linear-gradient(45deg, #212429 0.0%, #272a2f 3.2%, #2f3237 6.5%, #383b40 9.7%, #43464b 12.9%, #4f5357 16.1%, #5c6065 19.4%, #6b6e73 22.6%, #7a7d81 25.8%, #898d90 29.0%, #989c9f 32.3%, #a7aaae 35.5%, #b5b9bc 38.7%, #c2c6c9 41.9%, #ced1d4 45.2%, #d8dbde 48.4%, #dfe2e6 51.6%, #e5e9ec 54.8%, #eaedf1 58.1%, #eef1f6 61.3%, #f1f4f9 64.5%, #f3f6fb 67.7%, #f4f7fd 71.0%, #f5f7fe 74.2%, #f6f7ff 77.4%, #f6f6ff 80.6%, #f6f6ff 83.9%, #f6f5ff 87.1%, #f6f4fe 90.3%, #f6f4fe 93.5%, #f7f3fe 96.8%, #f8f4ff 100.0%);
background: linear-gradient(45deg in oklch, oklch(25.98% 0.0110 260.86) 0.0%, oklch(28.42% 0.0108 260.27) 3.2%, oklch(31.54% 0.0105 259.35) 6.5%, oklch(35.23% 0.0101 258.18) 9.7%, oklch(39.40% 0.0096 256.82) 12.9%, oklch(43.95% 0.0091 255.32) 16.1%, oklch(48.78% 0.0086 253.77) 19.4%, oklch(53.80% 0.0081 252.21) 22.6%, oklch(58.91% 0.0075 250.72) 25.8%, oklch(64.01% 0.0070 249.36) 29.0%, oklch(69.00% 0.0066 248.20) 32.3%, oklch(73.78% 0.0062 247.29) 35.5%, oklch(78.26% 0.0058 246.72) 38.7%, oklch(82.35% 0.0056 246.53) 41.9%, oklch(85.93% 0.0055 246.79) 45.2%, oklch(88.92% 0.0055 247.57) 48.4%, oklch(91.25% 0.0056 248.96) 51.6%, oklch(93.13% 0.0059 251.06) 54.8%, oklch(94.62% 0.0063 253.80) 58.1%, oklch(95.76% 0.0069 257.09) 61.3%, oklch(96.60% 0.0075 260.83) 64.5%, oklch(97.18% 0.0082 264.91) 67.7%, oklch(97.53% 0.0090 269.25) 71.0%, oklch(97.69% 0.0098 273.73) 74.2%, oklch(97.72% 0.0106 278.26) 77.4%, oklch(97.64% 0.0114 282.74) 80.6%, oklch(97.49% 0.0122 287.09) 83.9%, oklch(97.33% 0.0130 291.18) 87.1%, oklch(97.18% 0.0137 294.93) 90.3%, oklch(97.09% 0.0143 298.24) 93.5%, oklch(97.10% 0.0148 301.00) 96.8%, oklch(97.24% 0.0152 303.13) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.26 | 0.011 | 260.9 |
| 2 | 0.902 | 0.006 | 248.2 |
| 3 | 0.972 | 0.015 | 303.1 |

## In these collections

- [Gray gradients](https://grabient.com/gray-gradients)

## Other forms

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