# Pale sage, teal and navy color palette

The Pale sage, teal and navy color palette brings together pale green, light green, teal, and blue. The colors span a broad lightness range, combining moderate color with clear contrast. Its balanced and composed character suits poster layouts and editorial spreads. Its darkest tone is blue, and its lightest tone is pale green.

- Also called: Analogous gray, teal and navy linear gradient
- Seed: `kW6hVR65XGtkfwjBHUKJxrEo`
- Page: https://grabient.com/kW6hVR65XGtkfwjBHUKJxrEo?steps=32&angle=180
- Drawn as: linear gradient, 32 steps, 180 degrees
- Kinds: light to dark, vivid, cool
- Hues: analogous
- Contrast of its darkest and lightest colors: 10.6 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 | `#e4e8d2` | `oklch(92.13% 0.0289 114.61)` | Pale Pistachio | black, 16.7 to 1 |
| 2 | `#e0e7d0` | `oklch(91.58% 0.0314 119.46)` | Cabbage Leaf | black, 16.4 to 1 |
| 3 | `#dbe6cd` | `oklch(90.90% 0.0347 126.22)` | Misty Hillside | black, 16.1 to 1 |
| 4 | `#d4e4cb` | `oklch(90.10% 0.0386 134.30)` | Lacewing | black, 15.8 to 1 |
| 5 | `#cbe3c9` | `oklch(89.17% 0.0429 143.07)` | Jocular Green | black, 15.4 to 1 |
| 6 | `#c2e1c9` | `oklch(88.13% 0.0475 151.92)` | Luna Green | black, 14.9 to 1 |
| 7 | `#b7dfc9` | `oklch(86.96% 0.0520 160.24)` | Aqua Bay | black, 14.4 to 1 |
| 8 | `#addcc8` | `oklch(85.68% 0.0563 167.41)` | Brook Green | black, 13.8 to 1 |
| 9 | `#a3d9c8` | `oklch(84.28% 0.0602 172.86)` | Yucca Cream | black, 13.3 to 1 |
| 10 | `#9ad5c5` | `oklch(82.75% 0.0642 176.87)` | Aqua Glow | black, 12.6 to 1 |
| 11 | `#90d0c3` | `oklch(81.06% 0.0685 179.88)` | Opal Turquoise | black, 11.9 to 1 |
| 12 | `#85cbbf` | `oklch(79.26% 0.0728 182.18)` | Deco-Rate | black, 11.3 to 1 |
| 13 | `#7bc6bb` | `oklch(77.35% 0.0769 184.02)` | Booty Bay | black, 10.6 to 1 |
| 14 | `#70c0b6` | `oklch(75.35% 0.0806 185.67)` | Tropic Tide | black, 9.9 to 1 |
| 15 | `#65bab2` | `oklch(73.28% 0.0837 187.39)` | Pool Blue | black, 9.2 to 1 |
| 16 | `#5bb3ad` | `oklch(71.15% 0.0860 189.45)` | Artesian Well | black, 8.5 to 1 |
| 17 | `#51ada9` | `oklch(68.98% 0.0873 192.00)` | Emerald Succulent | black, 7.8 to 1 |
| 18 | `#48a5a5` | `oklch(66.72% 0.0876 194.52)` | Twilight Meadow | black, 7.2 to 1 |
| 19 | `#409e9f` | `oklch(64.36% 0.0871 196.99)` | Coolbox Ice Turquoise | black, 6.5 to 1 |
| 20 | `#39969a` | `oklch(61.93% 0.0860 199.50)` | Catalan | black, 5.9 to 1 |
| 21 | `#328d94` | `oklch(59.44% 0.0846 202.15)` | Aqueous | black, 5.3 to 1 |
| 22 | `#2c858e` | `oklch(56.91% 0.0830 205.04)` | Sea Bed | black, 4.8 to 1 |
| 23 | `#267d89` | `oklch(54.37% 0.0814 208.25)` | Bermuda | white, 4.8 to 1 |
| 24 | `#207483` | `oklch(51.82% 0.0802 211.90)` | Night Scape | white, 5.3 to 1 |
| 25 | `#1a6c7e` | `oklch(49.18% 0.0792 216.23)` | Allports | white, 6 to 1 |
| 26 | `#156278` | `oklch(46.26% 0.0782 221.53)` | Blue Enchantment | white, 6.8 to 1 |
| 27 | `#115871` | `oklch(43.20% 0.0772 227.44)` | Tardis | white, 7.8 to 1 |
| 28 | `#104e6b` | `oklch(40.14% 0.0762 233.59)` | Gemstone Blue | white, 9 to 1 |
| 29 | `#104564` | `oklch(37.22% 0.0752 239.59)` | Forest Blues | white, 10.2 to 1 |
| 30 | `#103c5d` | `oklch(34.58% 0.0743 245.09)` | Poseidon | white, 11.4 to 1 |
| 31 | `#113558` | `oklch(32.36% 0.0736 249.70)` | Incremental Blue | white, 12.4 to 1 |
| 32 | `#113053` | `oklch(30.71% 0.0730 253.04)` | Beyond the Stars | white, 13.3 to 1 |

## CSS

```css
background: linear-gradient(180deg, #e4e8d2 0.0%, #e0e7d0 3.2%, #dbe6cd 6.5%, #d4e4cb 9.7%, #cbe3c9 12.9%, #c2e1c9 16.1%, #b7dfc9 19.4%, #addcc8 22.6%, #a3d9c8 25.8%, #9ad5c5 29.0%, #90d0c3 32.3%, #85cbbf 35.5%, #7bc6bb 38.7%, #70c0b6 41.9%, #65bab2 45.2%, #5bb3ad 48.4%, #51ada9 51.6%, #48a5a5 54.8%, #409e9f 58.1%, #39969a 61.3%, #328d94 64.5%, #2c858e 67.7%, #267d89 71.0%, #207483 74.2%, #1a6c7e 77.4%, #156278 80.6%, #115871 83.9%, #104e6b 87.1%, #104564 90.3%, #103c5d 93.5%, #113558 96.8%, #113053 100.0%);
background: linear-gradient(180deg in oklch, oklch(92.13% 0.0289 114.61) 0.0%, oklch(91.58% 0.0314 119.46) 3.2%, oklch(90.90% 0.0347 126.22) 6.5%, oklch(90.10% 0.0386 134.30) 9.7%, oklch(89.17% 0.0429 143.07) 12.9%, oklch(88.13% 0.0475 151.92) 16.1%, oklch(86.96% 0.0520 160.24) 19.4%, oklch(85.68% 0.0563 167.41) 22.6%, oklch(84.28% 0.0602 172.86) 25.8%, oklch(82.75% 0.0642 176.87) 29.0%, oklch(81.06% 0.0685 179.88) 32.3%, oklch(79.26% 0.0728 182.18) 35.5%, oklch(77.35% 0.0769 184.02) 38.7%, oklch(75.35% 0.0806 185.67) 41.9%, oklch(73.28% 0.0837 187.39) 45.2%, oklch(71.15% 0.0860 189.45) 48.4%, oklch(68.98% 0.0873 192.00) 51.6%, oklch(66.72% 0.0876 194.52) 54.8%, oklch(64.36% 0.0871 196.99) 58.1%, oklch(61.93% 0.0860 199.50) 61.3%, oklch(59.44% 0.0846 202.15) 64.5%, oklch(56.91% 0.0830 205.04) 67.7%, oklch(54.37% 0.0814 208.25) 71.0%, oklch(51.82% 0.0802 211.90) 74.2%, oklch(49.18% 0.0792 216.23) 77.4%, oklch(46.26% 0.0782 221.53) 80.6%, oklch(43.20% 0.0772 227.44) 83.9%, oklch(40.14% 0.0762 233.59) 87.1%, oklch(37.22% 0.0752 239.59) 90.3%, oklch(34.58% 0.0743 245.09) 93.5%, oklch(32.36% 0.0736 249.70) 96.8%, oklch(30.71% 0.0730 253.04) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.921 | 0.029 | 114.6 |
| 2 | 0.846 | 0.059 | 171.7 |
| 3 | 0.701 | 0.087 | 190.7 |
| 4 | 0.512 | 0.08 | 212.9 |
| 5 | 0.307 | 0.073 | 253 |

## In these collections

- [Steel pan poster](https://grabient.com/steel-pan-poster)
- [Winter](https://grabient.com/winter)

## Other forms

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