# Stone, gray and sky blue modern palette

The Stone, gray and sky blue modern palette brings together light gray, gray, blue, and light blue. The colors span a moderate lightness range, combining moderate color with clear contrast. Its balanced and composed character suits travel posters and environmental mood boards. Its darkest tone is gray, and its lightest tone is light gray.

- Also called: Gray, blue and light blue linear swatches
- Seed: `kW5Ag8X4W_bsGPzFo6rY48_A`
- Page: https://grabient.com/kW5Ag8X4W_bsGPzFo6rY48_A?style=linearSwatches&steps=5
- Drawn as: linear swatches, 5 steps, 90 degrees
- Kinds: dark center, muted
- Hues: analogous
- Contrast of its darkest and lightest colors: 5.1 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 | `#e1ddd5` | `oklch(89.76% 0.0110 84.38)` | Milky | black, 15.4 to 1 |
| 2 | `#b4aea4` | `oklch(75.20% 0.0152 80.15)` | City of Bridges | black, 9.4 to 1 |
| 3 | `#5f584f` | `oklch(46.46% 0.0165 73.81)` | Dark LUA Console | white, 7 to 1 |
| 4 | `#4872a9` | `oklch(54.72% 0.0978 255.22)` | Song of the Sea | white, 4.9 to 1 |
| 5 | `#a4bbd2` | `oklch(78.35% 0.0413 247.82)` | Seascape Blue | black, 10.6 to 1 |

## CSS

```css
background: linear-gradient(90deg, #e1ddd5 0.000% 20.000%, #b4aea4 20.000% 40.000%, #5f584f 40.000% 60.000%, #4872a9 60.000% 80.000%, #a4bbd2 80.000% 100.000%);
background: linear-gradient(90deg, oklch(89.76% 0.0110 84.38) 0.000% 20.000%, oklch(75.20% 0.0152 80.15) 20.000% 40.000%, oklch(46.46% 0.0165 73.81) 40.000% 60.000%, oklch(54.72% 0.0978 255.22) 60.000% 80.000%, oklch(78.35% 0.0413 247.82) 80.000% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.898 | 0.011 | 84.4 |
| 2 | 0.752 | 0.015 | 80.1 |
| 3 | 0.465 | 0.017 | 73.8 |
| 4 | 0.547 | 0.098 | -104.8 |
| 5 | 0.783 | 0.041 | -112.2 |

## In these collections

- [Modern swatches](https://grabient.com/modern-swatches)

## Other forms

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