# Silver and blue color palette

The Silver and blue color palette brings together light gray, gray, dark gray, and blue. The colors span a broad lightness range, combining restrained color with clear contrast. Its balanced and composed character suits brand mood boards and editorial graphics. Its darkest tone is dark gray, and its lightest tone is light gray.

- Also called: Gray and dark gray angular swatches
- Seed: `kY2ABISALQ7GFQAlBkCnQfAEUOPo`
- Page: https://grabient.com/kY2ABISALQ7GFQAlBkCnQfAEUOPo?style=angularSwatches&steps=6&angle=225
- Drawn as: angular swatches, 6 steps, 225 degrees
- Kinds: dark center, 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 | `#cecece` | `oklch(85.04% 0.0000 89.88)` | Silver Eagle | black, 13.2 to 1 |
| 2 | `#73777a` | `oklch(56.69% 0.0069 244.97)` | Astrogranite | black, 4.6 to 1 |
| 3 | `#3f464c` | `oklch(38.98% 0.0138 246.02)` | Alpine Duck Grey | white, 9.5 to 1 |
| 4 | `#262c34` | `oklch(29.13% 0.0165 252.37)` | Night Sky | white, 14 to 1 |
| 5 | `#161d26` | `oklch(22.83% 0.0207 253.42)` | Coarse Wool | white, 16.9 to 1 |
| 6 | `#5c7385` | `oklch(54.33% 0.0386 241.80)` | Plumbeous | white, 4.9 to 1 |

## CSS

```css
background: conic-gradient(from 225deg, #cecece 0.000% 16.667%, #73777a 16.667% 33.333%, #3f464c 33.333% 50.000%, #262c34 50.000% 66.667%, #161d26 66.667% 83.333%, #5c7385 83.333% 100.000%);
background: conic-gradient(from 225deg, oklch(85.04% 0.0000 89.88) 0.000% 16.667%, oklch(56.69% 0.0069 244.97) 16.667% 33.333%, oklch(38.98% 0.0138 246.02) 33.333% 50.000%, oklch(29.13% 0.0165 252.37) 50.000% 66.667%, oklch(22.83% 0.0207 253.42) 66.667% 83.333%, oklch(54.33% 0.0386 241.80) 83.333% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.85 | 0 | 101.3 |
| 2 | 0.567 | 0.007 | 245 |
| 3 | 0.39 | 0.014 | 246 |
| 4 | 0.291 | 0.017 | 252.4 |
| 5 | 0.228 | 0.021 | 253.4 |
| 6 | 0.543 | 0.039 | 241.8 |

## In these collections

- [Minimal color palette](https://grabient.com/minimal-color-palette)
- [Neutral swatches](https://grabient.com/neutral-swatches)
- [Gray swatches](https://grabient.com/gray-swatches)

## Other forms

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