# Color Palette: Navy and deep cyan

The "Color Palette: Navy and deep cyan" palette brings together dark blue, green, blue, and pale green. The colors span a broad lightness range, combining moderate color with clear contrast. Its balanced and composed character suits brand mood boards and editorial graphics. Its darkest tone is dark blue, and its lightest tone is pale green.

- Also called: Analogous navy, teal, blue and off-white linear gradient
- Seed: `kURyi3zaszkMiS53DTHg`
- Page: https://grabient.com/kURyi3zaszkMiS53DTHg?steps=32
- Drawn as: linear gradient, 32 steps, 90 degrees
- Kinds: vivid, cool
- Hues: wide
- Contrast of its darkest and lightest colors: 12.2 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 | `#172944` | `oklch(27.95% 0.0551 258.05)` | Eternal Darkness | white, 14.6 to 1 |
| 2 | `#152f4a` | `oklch(30.02% 0.0591 251.19)` | Crow Black Blue | white, 13.6 to 1 |
| 3 | `#103953` | `oklch(32.90% 0.0647 241.32)` | Gibraltar Sea | white, 12.1 to 1 |
| 4 | `#01455c` | `oklch(36.37% 0.0715 229.25)` | Loyal Blue | white, 10.5 to 1 |
| 5 | `#005261` | `oklch(40.25% 0.0714 215.87)` | Sandalwood Grey Blue | white, 8.8 to 1 |
| 6 | `#005f65` | `oklch(44.33% 0.0754 201.92)` | Beau Vert | white, 7.3 to 1 |
| 7 | `#006e68` | `oklch(48.39% 0.0841 188.30)` | Tide Pools | white, 6.1 to 1 |
| 8 | `#007c67` | `oklch(52.25% 0.0978 175.84)` | Ultramarine Green | white, 5.1 to 1 |
| 9 | `#1b8764` | `oklch(55.70% 0.1089 165.39)` | Spectral Green | black, 4.7 to 1 |
| 10 | `#329061` | `oklch(58.54% 0.1142 157.76)` | Viridian | black, 5.2 to 1 |
| 11 | `#3f9660` | `oklch(60.56% 0.1178 153.79)` | Eucalyptus | black, 5.7 to 1 |
| 12 | `#3f9a64` | `oklch(61.56% 0.1195 154.46)` | Green Fondant | black, 5.9 to 1 |
| 13 | `#319a6b` | `oklch(61.50% 0.1199 160.13)` | Green Fondant | black, 5.9 to 1 |
| 14 | `#079877` | `oklch(60.61% 0.1192 169.73)` | Cadaverous | black, 5.7 to 1 |
| 15 | `#009283` | `oklch(59.15% 0.1059 182.11)` | Silk Sari | black, 5.4 to 1 |
| 16 | `#008a8b` | `oklch(57.35% 0.0977 196.15)` | Dark Cyan | black, 4.9 to 1 |
| 17 | `#008292` | `oklch(55.46% 0.0962 210.70)` | Island Lush | black, 4.5 to 1 |
| 18 | `#007a9a` | `oklch(53.74% 0.1015 224.61)` | Sea Sight | white, 4.9 to 1 |
| 19 | `#1a729e` | `oklch(52.42% 0.1046 236.72)` | Quarterdeck | white, 5.3 to 1 |
| 20 | `#306d9e` | `oklch(51.75% 0.1005 245.93)` | Lochmara | white, 5.5 to 1 |
| 21 | `#3b6c9e` | `oklch(51.98% 0.0964 251.09)` | Star Sapphire | white, 5.4 to 1 |
| 22 | `#4270a1` | `oklch(53.35% 0.0923 251.10)` | Naval | white, 5.1 to 1 |
| 23 | `#4679a5` | `oklch(55.93% 0.0874 246.18)` | Billycart Blue | white, 4.6 to 1 |
| 24 | `#4c86aa` | `oklch(59.48% 0.0817 237.30)` | Cornwall | black, 5.2 to 1 |
| 25 | `#5595ae` | `oklch(63.76% 0.0754 225.39)` | Blue Persia | black, 6.3 to 1 |
| 26 | `#65a6b2` | `oklch(68.54% 0.0688 211.34)` | Seaside | black, 7.6 to 1 |
| 27 | `#7ab6b6` | `oklch(73.55% 0.0621 196.08)` | Kingfisher Turquoise | black, 9.1 to 1 |
| 28 | `#92c5bb` | `oklch(78.57% 0.0555 180.51)` | Float Your Boat | black, 10.9 to 1 |
| 29 | `#abd3c1` | `oklch(83.34% 0.0494 165.54)` | Southern Belle | black, 12.8 to 1 |
| 30 | `#c2dfc8` | `oklch(87.61% 0.0439 152.08)` | Luna Green | black, 14.6 to 1 |
| 31 | `#d4e9d1` | `oklch(91.15% 0.0393 141.05)` | Venetian Pearl | black, 16.3 to 1 |
| 32 | `#e1f0d8` | `oklch(93.70% 0.0358 133.35)` | Hint of Mint | black, 17.6 to 1 |

## CSS

```css
background: linear-gradient(90deg, #172944 0.0%, #152f4a 3.2%, #103953 6.5%, #01455c 9.7%, #005261 12.9%, #005f65 16.1%, #006e68 19.4%, #007c67 22.6%, #1b8764 25.8%, #329061 29.0%, #3f9660 32.3%, #3f9a64 35.5%, #319a6b 38.7%, #079877 41.9%, #009283 45.2%, #008a8b 48.4%, #008292 51.6%, #007a9a 54.8%, #1a729e 58.1%, #306d9e 61.3%, #3b6c9e 64.5%, #4270a1 67.7%, #4679a5 71.0%, #4c86aa 74.2%, #5595ae 77.4%, #65a6b2 80.6%, #7ab6b6 83.9%, #92c5bb 87.1%, #abd3c1 90.3%, #c2dfc8 93.5%, #d4e9d1 96.8%, #e1f0d8 100.0%);
background: linear-gradient(90deg in oklch, oklch(27.95% 0.0551 258.05) 0.0%, oklch(30.02% 0.0591 251.19) 3.2%, oklch(32.90% 0.0647 241.32) 6.5%, oklch(36.37% 0.0715 229.25) 9.7%, oklch(40.25% 0.0714 215.87) 12.9%, oklch(44.33% 0.0754 201.92) 16.1%, oklch(48.39% 0.0841 188.30) 19.4%, oklch(52.25% 0.0978 175.84) 22.6%, oklch(55.70% 0.1089 165.39) 25.8%, oklch(58.54% 0.1142 157.76) 29.0%, oklch(60.56% 0.1178 153.79) 32.3%, oklch(61.56% 0.1195 154.46) 35.5%, oklch(61.50% 0.1199 160.13) 38.7%, oklch(60.61% 0.1192 169.73) 41.9%, oklch(59.15% 0.1059 182.11) 45.2%, oklch(57.35% 0.0977 196.15) 48.4%, oklch(55.46% 0.0962 210.70) 51.6%, oklch(53.74% 0.1015 224.61) 54.8%, oklch(52.42% 0.1046 236.72) 58.1%, oklch(51.75% 0.1005 245.93) 61.3%, oklch(51.98% 0.0964 251.09) 64.5%, oklch(53.35% 0.0923 251.10) 67.7%, oklch(55.93% 0.0874 246.18) 71.0%, oklch(59.48% 0.0817 237.30) 74.2%, oklch(63.76% 0.0754 225.39) 77.4%, oklch(68.54% 0.0688 211.34) 80.6%, oklch(73.55% 0.0621 196.08) 83.9%, oklch(78.57% 0.0555 180.51) 87.1%, oklch(83.34% 0.0494 165.54) 90.3%, oklch(87.61% 0.0439 152.08) 93.5%, oklch(91.15% 0.0393 141.05) 96.8%, oklch(93.70% 0.0358 133.35) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.28 | 0.055 | 258 |
| 2 | 0.61 | 0.119 | 153.4 |
| 3 | 0.528 | 0.094 | 251.7 |
| 4 | 0.937 | 0.036 | 133.4 |

## In these collections

- [Jacaranda first bloom](https://grabient.com/jacaranda-first-bloom)
- [Turquoise](https://grabient.com/turquoise)
- [Green multicolor gradients](https://grabient.com/green-multicolor-gradients)
- [Blue and green gradients](https://grabient.com/blue-and-green-gradients)

## Other forms

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