# Sky blue, violet and sage color palette

The Sky blue, violet and sage color palette brings together light blue, blue, purple, magenta, and green. The colors span a narrow lightness range, combining moderate color with gentle contrast. Its balanced and composed character suits travel posters and environmental mood boards. Its darkest tone is green, and its lightest tone is light blue.

- Also called: Light blue, lavender, brown and gray linear gradient
- Seed: `kW1xywz5vAlOgxPVmkZTJJRo`
- Page: https://grabient.com/kW1xywz5vAlOgxPVmkZTJJRo?steps=32&angle=45
- Drawn as: linear gradient, 32 steps, 45 degrees
- Kinds: muted
- Hues: wide
- Contrast of its darkest and lightest colors: 2.4 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 | `#bacfe5` | `oklch(84.65% 0.0386 248.20)` | Bewitching Blue | black, 13.1 to 1 |
| 2 | `#b2c9e1` | `oklch(82.70% 0.0417 248.36)` | Wind Blue | black, 12.3 to 1 |
| 3 | `#a7c1da` | `oklch(79.90% 0.0461 248.28)` | Canopy Bed | black, 11.2 to 1 |
| 4 | `#9ab6d3` | `oklch(76.56% 0.0514 248.17)` | Blue Satin | black, 10 to 1 |
| 5 | `#8cabca` | `oklch(72.97% 0.0570 248.23)` | Northern Sky | black, 8.8 to 1 |
| 6 | `#7ea1c3` | `oklch(69.46% 0.0628 248.67)` | Far Horizons | black, 7.7 to 1 |
| 7 | `#7397bc` | `oklch(66.31% 0.0682 249.69)` | Blue Ballad | black, 6.8 to 1 |
| 8 | `#6b8fb7` | `oklch(63.83% 0.0730 251.49)` | Hushed Lilac | black, 6.2 to 1 |
| 9 | `#678ab5` | `oklch(62.32% 0.0766 254.29)` | Blue Dazzle | black, 5.8 to 1 |
| 10 | `#6787b5` | `oklch(61.69% 0.0797 258.08)` | Kimono | black, 5.6 to 1 |
| 11 | `#6b85b7` | `oklch(61.72% 0.0824 262.71)` | Kimono | black, 5.6 to 1 |
| 12 | `#7185bb` | `oklch(62.22% 0.0848 268.00)` | Orbital | black, 5.7 to 1 |
| 13 | `#7985be` | `oklch(63.02% 0.0868 273.81)` | Deep Periwinkle | black, 5.9 to 1 |
| 14 | `#8186c1` | `oklch(63.96% 0.0883 279.96)` | True Lavender | black, 6.1 to 1 |
| 15 | `#8a87c3` | `oklch(64.86% 0.0892 286.29)` | Brocade | black, 6.3 to 1 |
| 16 | `#9287c3` | `oklch(65.54% 0.0896 292.63)` | Amethyst Grey | black, 6.4 to 1 |
| 17 | `#9986c1` | `oklch(65.91% 0.0893 298.72)` | Petrified Purple | black, 6.5 to 1 |
| 18 | `#9f86bf` | `oklch(66.28% 0.0882 304.00)` | Petrified Purple | black, 6.6 to 1 |
| 19 | `#a486bd` | `oklch(66.68% 0.0863 308.89)` | Lilac Purple | black, 6.7 to 1 |
| 20 | `#a886ba` | `oklch(67.05% 0.0839 313.93)` | Purple Statice | black, 6.7 to 1 |
| 21 | `#ad86b6` | `oklch(67.36% 0.0811 319.66)` | African Violet | black, 6.8 to 1 |
| 22 | `#b186b0` | `oklch(67.55% 0.0781 326.63)` | African Violet | black, 6.9 to 1 |
| 23 | `#b586a9` | `oklch(67.58% 0.0751 335.38)` | Opera Mauve | black, 6.9 to 1 |
| 24 | `#b885a0` | `oklch(67.40% 0.0723 346.45)` | Opera Mauve | black, 6.8 to 1 |
| 25 | `#ba8392` | `oklch(66.95% 0.0696 1.01)` | Berry Blush | black, 6.7 to 1 |
| 26 | `#b88382` | `oklch(66.17% 0.0665 19.99)` | Bashful Rose | black, 6.5 to 1 |
| 27 | `#b28371` | `oklch(65.16% 0.0632 41.89)` | Pink Earth | black, 6.3 to 1 |
| 28 | `#a68566` | `oklch(64.02% 0.0599 65.13)` | Wooden Swing | black, 6.1 to 1 |
| 29 | `#978761` | `oklch(62.86% 0.0567 88.12)` | Treasure Chamber | black, 5.9 to 1 |
| 30 | `#878963` | `oklch(61.78% 0.0538 109.27)` | Green Savage | black, 5.7 to 1 |
| 31 | `#7a8968` | `oklch(60.87% 0.0514 126.99)` | Swedish Clover | black, 5.6 to 1 |
| 32 | `#72896c` | `oklch(60.24% 0.0496 139.71)` | Wonderland | black, 5.4 to 1 |

## CSS

```css
background: linear-gradient(45deg, #bacfe5 0.0%, #b2c9e1 3.2%, #a7c1da 6.5%, #9ab6d3 9.7%, #8cabca 12.9%, #7ea1c3 16.1%, #7397bc 19.4%, #6b8fb7 22.6%, #678ab5 25.8%, #6787b5 29.0%, #6b85b7 32.3%, #7185bb 35.5%, #7985be 38.7%, #8186c1 41.9%, #8a87c3 45.2%, #9287c3 48.4%, #9986c1 51.6%, #9f86bf 54.8%, #a486bd 58.1%, #a886ba 61.3%, #ad86b6 64.5%, #b186b0 67.7%, #b586a9 71.0%, #b885a0 74.2%, #ba8392 77.4%, #b88382 80.6%, #b28371 83.9%, #a68566 87.1%, #978761 90.3%, #878963 93.5%, #7a8968 96.8%, #72896c 100.0%);
background: linear-gradient(45deg in oklch, oklch(84.65% 0.0386 248.20) 0.0%, oklch(82.70% 0.0417 248.36) 3.2%, oklch(79.90% 0.0461 248.28) 6.5%, oklch(76.56% 0.0514 248.17) 9.7%, oklch(72.97% 0.0570 248.23) 12.9%, oklch(69.46% 0.0628 248.67) 16.1%, oklch(66.31% 0.0682 249.69) 19.4%, oklch(63.83% 0.0730 251.49) 22.6%, oklch(62.32% 0.0766 254.29) 25.8%, oklch(61.69% 0.0797 258.08) 29.0%, oklch(61.72% 0.0824 262.71) 32.3%, oklch(62.22% 0.0848 268.00) 35.5%, oklch(63.02% 0.0868 273.81) 38.7%, oklch(63.96% 0.0883 279.96) 41.9%, oklch(64.86% 0.0892 286.29) 45.2%, oklch(65.54% 0.0896 292.63) 48.4%, oklch(65.91% 0.0893 298.72) 51.6%, oklch(66.28% 0.0882 304.00) 54.8%, oklch(66.68% 0.0863 308.89) 58.1%, oklch(67.05% 0.0839 313.93) 61.3%, oklch(67.36% 0.0811 319.66) 64.5%, oklch(67.55% 0.0781 326.63) 67.7%, oklch(67.58% 0.0751 335.38) 71.0%, oklch(67.40% 0.0723 346.45) 74.2%, oklch(66.95% 0.0696 1.01) 77.4%, oklch(66.17% 0.0665 19.99) 80.6%, oklch(65.16% 0.0632 41.89) 83.9%, oklch(64.02% 0.0599 65.13) 87.1%, oklch(62.86% 0.0567 88.12) 90.3%, oklch(61.78% 0.0538 109.27) 93.5%, oklch(60.87% 0.0514 126.99) 96.8%, oklch(60.24% 0.0496 139.71) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.846 | 0.039 | 248.2 |
| 2 | 0.626 | 0.076 | 253.5 |
| 3 | 0.657 | 0.09 | 295.8 |
| 4 | 0.673 | 0.072 | 349.7 |
| 5 | 0.602 | 0.05 | 499.7 |

## In these collections

- [Hydrangea ribbon boutonniere](https://grabient.com/hydrangea-ribbon-boutonniere)
- [Blue and purple gradients](https://grabient.com/blue-and-purple-gradients)

## Other forms

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