# Silver Charcoal Blue Gray

Gray, black and dark gray radial swatches with 5 colors: #dadbdc, #22282d, #727d86, #918b88, #353d45. Edit it and copy or download CSS, SVG, PNG or shader code.

- Also called: Gray, black and dark gray radial swatches
- Seed: `kW4gK8IoU-EoHP1Rg1OLQas4`
- Page: https://grabient.com/kW4gK8IoU-EoHP1Rg1OLQas4?style=radialSwatches&steps=5&angle=0
- Drawn as: radial swatches, 5 steps, 0 degrees
- Kinds: neutral
- Hues: achromatic
- Contrast of its darkest and lightest colors: 10.7 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 | `#dadbdc` | `oklch(88.98% 0.0028 264.37)` | Spring Thaw | black, 15 to 1 |
| 2 | `#22282d` | `oklch(27.17% 0.0138 248.52)` | Black Grey | white, 14.9 to 1 |
| 3 | `#727d86` | `oklch(58.27% 0.0193 243.24)` | Deep Shale | black, 4.9 to 1 |
| 4 | `#918b88` | `oklch(64.17% 0.0083 49.15)` | Creek Bend | black, 6.2 to 1 |
| 5 | `#353d45` | `oklch(35.43% 0.0179 248.52)` | Do Not Disturb | white, 11 to 1 |

## CSS

```css
background: radial-gradient(circle at 50% 50%, #dadbdc 0.000% 20.000%, #22282d 20.000% 40.000%, #727d86 40.000% 60.000%, #918b88 60.000% 80.000%, #353d45 80.000% 100.000%);
background: radial-gradient(circle at 50% 50%, oklch(88.98% 0.0028 264.37) 0.000% 20.000%, oklch(27.17% 0.0138 248.52) 20.000% 40.000%, oklch(58.27% 0.0193 243.24) 40.000% 60.000%, oklch(64.17% 0.0083 49.15) 60.000% 80.000%, oklch(35.43% 0.0179 248.52) 80.000% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.89 | 0.003 | 264.4 |
| 2 | 0.272 | 0.014 | 248.5 |
| 3 | 0.583 | 0.019 | 243.2 |
| 4 | 0.642 | 0.008 | 409.1 |
| 5 | 0.354 | 0.018 | 248.5 |

## In these collections

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

## Other forms

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