# Analogous gray, teal and navy linear swatches

Analogous gray, teal and navy linear swatches with 32 colors: #e4e8d2, #e0e7d0, #dbe6cd, #d4e4cb, #cbe3c9, #c2e1c9, #b7dfc9, #addcc8, #a3d9c8, #9ad5c5, #90d0c3, #85cbbf, #7bc6bb, #70c0b6, #65bab2, #5bb3ad, #51ada9, #48a5a5, #409e9f, #39969a, #328d94, #2c858e, #267d89, #207483, #1a6c7e, #156278, #115871, #104e6b, #104564, #103c5d, #113558, #113053. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kW6hVR65XGtkfwjBHUKJxrEo`
- Page: https://grabient.com/kW6hVR65XGtkfwjBHUKJxrEo?style=linearSwatches&steps=32&angle=180
- Drawn as: linear swatches, 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.000% 3.125%, #e0e7d0 3.125% 6.250%, #dbe6cd 6.250% 9.375%, #d4e4cb 9.375% 12.500%, #cbe3c9 12.500% 15.625%, #c2e1c9 15.625% 18.750%, #b7dfc9 18.750% 21.875%, #addcc8 21.875% 25.000%, #a3d9c8 25.000% 28.125%, #9ad5c5 28.125% 31.250%, #90d0c3 31.250% 34.375%, #85cbbf 34.375% 37.500%, #7bc6bb 37.500% 40.625%, #70c0b6 40.625% 43.750%, #65bab2 43.750% 46.875%, #5bb3ad 46.875% 50.000%, #51ada9 50.000% 53.125%, #48a5a5 53.125% 56.250%, #409e9f 56.250% 59.375%, #39969a 59.375% 62.500%, #328d94 62.500% 65.625%, #2c858e 65.625% 68.750%, #267d89 68.750% 71.875%, #207483 71.875% 75.000%, #1a6c7e 75.000% 78.125%, #156278 78.125% 81.250%, #115871 81.250% 84.375%, #104e6b 84.375% 87.500%, #104564 87.500% 90.625%, #103c5d 90.625% 93.750%, #113558 93.750% 96.875%, #113053 96.875% 100.000%);
background: linear-gradient(180deg, oklch(92.13% 0.0289 114.61) 0.000% 3.125%, oklch(91.58% 0.0314 119.46) 3.125% 6.250%, oklch(90.90% 0.0347 126.22) 6.250% 9.375%, oklch(90.10% 0.0386 134.30) 9.375% 12.500%, oklch(89.17% 0.0429 143.07) 12.500% 15.625%, oklch(88.13% 0.0475 151.92) 15.625% 18.750%, oklch(86.96% 0.0520 160.24) 18.750% 21.875%, oklch(85.68% 0.0563 167.41) 21.875% 25.000%, oklch(84.28% 0.0602 172.86) 25.000% 28.125%, oklch(82.75% 0.0642 176.87) 28.125% 31.250%, oklch(81.06% 0.0685 179.88) 31.250% 34.375%, oklch(79.26% 0.0728 182.18) 34.375% 37.500%, oklch(77.35% 0.0769 184.02) 37.500% 40.625%, oklch(75.35% 0.0806 185.67) 40.625% 43.750%, oklch(73.28% 0.0837 187.39) 43.750% 46.875%, oklch(71.15% 0.0860 189.45) 46.875% 50.000%, oklch(68.98% 0.0873 192.00) 50.000% 53.125%, oklch(66.72% 0.0876 194.52) 53.125% 56.250%, oklch(64.36% 0.0871 196.99) 56.250% 59.375%, oklch(61.93% 0.0860 199.50) 59.375% 62.500%, oklch(59.44% 0.0846 202.15) 62.500% 65.625%, oklch(56.91% 0.0830 205.04) 65.625% 68.750%, oklch(54.37% 0.0814 208.25) 68.750% 71.875%, oklch(51.82% 0.0802 211.90) 71.875% 75.000%, oklch(49.18% 0.0792 216.23) 75.000% 78.125%, oklch(46.26% 0.0782 221.53) 78.125% 81.250%, oklch(43.20% 0.0772 227.44) 81.250% 84.375%, oklch(40.14% 0.0762 233.59) 84.375% 87.500%, oklch(37.22% 0.0752 239.59) 87.500% 90.625%, oklch(34.58% 0.0743 245.09) 90.625% 93.750%, oklch(32.36% 0.0736 249.70) 93.750% 96.875%, oklch(30.71% 0.0730 253.04) 96.875% 100.000%);
```

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