# Sky blue, sage and gold color palette

The Sky blue, sage and gold color palette brings together light blue, teal, green, orange, and light orange. The colors span a moderate lightness range, combining restrained 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: Gray and green angular swatches
- Seed: `kY2BWf2hO9kYUvPEkzp1xU6-qPPs`
- Page: https://grabient.com/kY2BWf2hO9kYUvPEkzp1xU6-qPPs?style=angularSwatches&steps=6&angle=225
- Drawn as: angular swatches, 6 steps, 225 degrees
- Kinds: dark center, muted
- Hues: wide
- Contrast of its darkest and lightest colors: 3.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 | `#bbd2dc` | `oklch(85.04% 0.0289 224.30)` | Bahama Breezes | black, 13.4 to 1 |
| 2 | `#79abb1` | `oklch(70.87% 0.0537 204.22)` | Smoky Mountain Spring | black, 8.2 to 1 |
| 3 | `#4b7d72` | `oklch(55.12% 0.0565 178.86)` | Azurite Water Green | white, 4.6 to 1 |
| 4 | `#637556` | `oklch(53.94% 0.0524 132.36)` | Wild Axolotl | white, 4.9 to 1 |
| 5 | `#a89971` | `oklch(68.50% 0.0579 90.09)` | Sunbaked Adobe | black, 7.4 to 1 |
| 6 | `#d8c8ac` | `oklch(83.86% 0.0413 80.58)` | New Khaki | black, 12.7 to 1 |

## CSS

```css
background: conic-gradient(from 225deg, #bbd2dc 0.000% 16.667%, #79abb1 16.667% 33.333%, #4b7d72 33.333% 50.000%, #637556 50.000% 66.667%, #a89971 66.667% 83.333%, #d8c8ac 83.333% 100.000%);
background: conic-gradient(from 225deg, oklch(85.04% 0.0289 224.30) 0.000% 16.667%, oklch(70.87% 0.0537 204.22) 16.667% 33.333%, oklch(55.12% 0.0565 178.86) 33.333% 50.000%, oklch(53.94% 0.0524 132.36) 50.000% 66.667%, oklch(68.50% 0.0579 90.09) 66.667% 83.333%, oklch(83.86% 0.0413 80.58) 83.333% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.85 | 0.029 | 224.3 |
| 2 | 0.709 | 0.054 | 204.2 |
| 3 | 0.551 | 0.056 | 178.9 |
| 4 | 0.539 | 0.052 | 132.4 |
| 5 | 0.685 | 0.058 | 90.1 |
| 6 | 0.839 | 0.041 | 80.6 |

## In these collections

- [Beach swatches](https://grabient.com/beach-swatches)
- [Calm swatches](https://grabient.com/calm-swatches)
- [Coastal swatches](https://grabient.com/coastal-swatches)
- [Spring tide seagrass](https://grabient.com/spring-tide-seagrass)

## Other forms

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