# Stone and blue dusk palette

The Stone and blue dusk palette brings together light gray, light blue, blue, and dark 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 blue, and its lightest tone is light gray.

- Also called: Gray and navy linear swatches
- Seed: `kY0xDNYgo_9oMv_Sjj_yw8-aYMvY`
- Page: https://grabient.com/kY0xDNYgo_9oMv_Sjj_yw8-aYMvY?style=linearSwatches&steps=6
- Drawn as: linear swatches, 6 steps, 90 degrees
- Kinds: light to dark, neutral, cool
- Hues: analogous
- Contrast of its darkest and lightest colors: 8 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 | `#c6c6d5` | `oklch(83.07% 0.0220 288.28)` | Kiri Mist | black, 12.4 to 1 |
| 2 | `#b3b2c6` | `oklch(77.17% 0.0276 288.28)` | Filtered Light | black, 10.1 to 1 |
| 3 | `#a09eb6` | `oklch(70.87% 0.0344 288.28)` | Wild Thistle | black, 8 to 1 |
| 4 | `#8d8ca6` | `oklch(64.96% 0.0386 288.28)` | Delicate Violet | black, 6.4 to 1 |
| 5 | `#767c97` | `oklch(59.06% 0.0413 275.60)` | Waterloo | black, 5 to 1 |
| 6 | `#222e3f` | `oklch(29.92% 0.0344 255.52)` | Imperial Primer | white, 13.6 to 1 |

## CSS

```css
background: linear-gradient(90deg, #c6c6d5 0.000% 16.667%, #b3b2c6 16.667% 33.333%, #a09eb6 33.333% 50.000%, #8d8ca6 50.000% 66.667%, #767c97 66.667% 83.333%, #222e3f 83.333% 100.000%);
background: linear-gradient(90deg, oklch(83.07% 0.0220 288.28) 0.000% 16.667%, oklch(77.17% 0.0276 288.28) 16.667% 33.333%, oklch(70.87% 0.0344 288.28) 33.333% 50.000%, oklch(64.96% 0.0386 288.28) 50.000% 66.667%, oklch(59.06% 0.0413 275.60) 66.667% 83.333%, oklch(29.92% 0.0344 255.52) 83.333% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.831 | 0.022 | 288.3 |
| 2 | 0.772 | 0.028 | 288.3 |
| 3 | 0.709 | 0.034 | 288.3 |
| 4 | 0.65 | 0.039 | 288.3 |
| 5 | 0.591 | 0.041 | 275.6 |
| 6 | 0.299 | 0.034 | 255.5 |

## In these collections

- [Dusk swatches](https://grabient.com/dusk-swatches)

## Other forms

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