# Dusty blue and stone color palette

The Dusty blue and stone color palette brings together gray, light gray, off-white, and light orange. The colors span a broad lightness range, combining restrained color with clear contrast. Its light and open character suits brand mood boards and editorial graphics. Its darkest tone is gray, and its lightest tone is off-white.

- Also called: Dark gray and white linear swatches
- Seed: `kYVwqt6oU-vmErxcDbwzIgrXkDPW`
- Page: https://grabient.com/kYVwqt6oU-vmErxcDbwzIgrXkDPW?style=linearSwatches&steps=6
- Drawn as: linear swatches, 6 steps, 90 degrees
- Kinds: light center, neutral
- Hues: achromatic
- Contrast of its darkest and lightest colors: 10.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 | `#333a3f` | `oklch(34.25% 0.0138 243.98)` | Tempest in a Teapot | white, 11.6 to 1 |
| 2 | `#c2ccd2` | `oklch(83.86% 0.0138 233.42)` | Stone Golem | black, 12.8 to 1 |
| 3 | `#f4f1e8` | `oklch(95.67% 0.0124 90.76)` | Wishful White | black, 18.5 to 1 |
| 4 | `#b8a18f` | `oklch(72.44% 0.0372 59.05)` | Hickory | black, 8.5 to 1 |
| 5 | `#76838e` | `oklch(60.24% 0.0220 244.69)` | Battle Blue | black, 5.3 to 1 |
| 6 | `#eaf1f3` | `oklch(95.28% 0.0083 223.55)` | Powder White | black, 18.3 to 1 |

## CSS

```css
background: linear-gradient(90deg, #333a3f 0.000% 16.667%, #c2ccd2 16.667% 33.333%, #f4f1e8 33.333% 50.000%, #b8a18f 50.000% 66.667%, #76838e 66.667% 83.333%, #eaf1f3 83.333% 100.000%);
background: linear-gradient(90deg, oklch(34.25% 0.0138 243.98) 0.000% 16.667%, oklch(83.86% 0.0138 233.42) 16.667% 33.333%, oklch(95.67% 0.0124 90.76) 33.333% 50.000%, oklch(72.44% 0.0372 59.05) 50.000% 66.667%, oklch(60.24% 0.0220 244.69) 66.667% 83.333%, oklch(95.28% 0.0083 223.55) 83.333% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.343 | 0.014 | 244 |
| 2 | 0.839 | 0.014 | 233.4 |
| 3 | 0.957 | 0.012 | 90.8 |
| 4 | 0.724 | 0.037 | 59.1 |
| 5 | 0.602 | 0.022 | -115.3 |
| 6 | 0.953 | 0.008 | -136.4 |

## In these collections

- [Muted multicolor swatches](https://grabient.com/muted-multicolor-swatches)
- [Muted swatches](https://grabient.com/muted-swatches)
- [Silver color palette](https://grabient.com/silver-color-palette)
- [Calm swatches](https://grabient.com/calm-swatches)

## Other forms

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