# Mist sky slate facets

Five angular wedges combine green-white mist, sky blue, deep slate, seafoam, and warm gray. The pale opening and darker blue anchor give the two watery midtones space, while the gray softens their contrast. Use this quiet combination for wellness identities, coastal stationery, or calm interior planning.

- Also called: Gray and light blue angular swatches
- Seed: `kW9wdgYZdMziPwLnFzj0gQsQ`
- Page: https://grabient.com/kW9wdgYZdMziPwLnFzj0gQsQ?style=angularSwatches&steps=5&angle=45
- Drawn as: angular swatches, 5 steps, 45 degrees
- Kinds: dark center, pastel, cool
- Hues: wide
- Contrast of its darkest and lightest colors: 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 | `#f3f7f1` | `oklch(97.24% 0.0096 135.00)` | Laundry White | black, 19.4 to 1 |
| 2 | `#91b9d9` | `oklch(76.77% 0.0634 243.85)` | Blue Beyond | black, 10.1 to 1 |
| 3 | `#42566b` | `oklch(44.49% 0.0427 250.19)` | Inkjet | white, 7.5 to 1 |
| 4 | `#91cfcb` | `oklch(81.10% 0.0634 191.01)` | Lake | black, 11.9 to 1 |
| 5 | `#948b8a` | `oklch(64.57% 0.0110 25.10)` | Greylac | black, 6.3 to 1 |

## CSS

```css
background: conic-gradient(from 45deg, #f3f7f1 0.000% 20.000%, #91b9d9 20.000% 40.000%, #42566b 40.000% 60.000%, #91cfcb 60.000% 80.000%, #948b8a 80.000% 100.000%);
background: conic-gradient(from 45deg, oklch(97.24% 0.0096 135.00) 0.000% 20.000%, oklch(76.77% 0.0634 243.85) 20.000% 40.000%, oklch(44.49% 0.0427 250.19) 40.000% 60.000%, oklch(81.10% 0.0634 191.01) 60.000% 80.000%, oklch(64.57% 0.0110 25.10) 80.000% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.972 | 0.01 | 135 |
| 2 | 0.768 | 0.063 | 243.8 |
| 3 | 0.445 | 0.043 | 250.2 |
| 4 | 0.811 | 0.063 | 191 |
| 5 | 0.646 | 0.011 | 25.1 |

## In these collections

- [Calm swatches](https://grabient.com/calm-swatches)

## Other forms

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