# Navy, turquoise and emerald color palette

The Navy, turquoise and emerald color palette brings together dark blue, blue, teal, green, and light green. The colors span a broad lightness range, combining moderate color with clear contrast. Its balanced and composed character suits seasonal packaging and event invitations. Its darkest tone is dark blue, and its lightest tone is light green.

- Also called: Duotone navy to green linear gradient
- Seed: `kWRyi3wyI_MadO1Nqzj4qU-g`
- Page: https://grabient.com/kWRyi3wyI_MadO1Nqzj4qU-g?steps=32
- Drawn as: linear gradient, 32 steps, 90 degrees
- Kinds: dark to light, cool
- Hues: wide
- Contrast of its darkest and lightest colors: 7.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 | `#172944` | `oklch(27.95% 0.0551 258.05)` | Eternal Darkness | white, 14.6 to 1 |
| 2 | `#1b2e4b` | `oklch(30.10% 0.0586 257.78)` | Manganese Black | white, 13.6 to 1 |
| 3 | `#203656` | `oklch(33.14% 0.0636 257.67)` | Boatswain | white, 12.1 to 1 |
| 4 | `#274063` | `oklch(36.76% 0.0697 257.56)` | Elmer’s Echo | white, 10.5 to 1 |
| 5 | `#2e4a72` | `oklch(40.68% 0.0761 257.27)` | Enchanted Navy | white, 8.9 to 1 |
| 6 | `#355581` | `oklch(44.58% 0.0823 256.63)` | Overtake | white, 7.5 to 1 |
| 7 | `#3b5f8f` | `oklch(48.16% 0.0878 255.48)` | Antilles Blue | white, 6.5 to 1 |
| 8 | `#3f689a` | `oklch(51.12% 0.0919 253.64)` | Star Sapphire | white, 5.7 to 1 |
| 9 | `#406fa1` | `oklch(53.18% 0.0940 250.95)` | Muted Blue | white, 5.2 to 1 |
| 10 | `#3f74a4` | `oklch(54.42% 0.0939 247.48)` | Decoration Blue | white, 4.9 to 1 |
| 11 | `#3d77a3` | `oklch(55.09% 0.0920 243.35)` | Taiwan Blue Magpie | white, 4.7 to 1 |
| 12 | `#3b79a1` | `oklch(55.33% 0.0890 238.65)` | Peninsula | white, 4.7 to 1 |
| 13 | `#387b9d` | `oklch(55.31% 0.0855 233.46)` | Blue Dart Frog | white, 4.7 to 1 |
| 14 | `#357b98` | `oklch(55.20% 0.0823 227.86)` | Blue Dart Frog | white, 4.7 to 1 |
| 15 | `#337c93` | `oklch(55.14% 0.0801 221.93)` | Blue Rodeo | white, 4.7 to 1 |
| 16 | `#307e90` | `oklch(55.30% 0.0794 215.76)` | Forget-Me-Not Blue | white, 4.6 to 1 |
| 17 | `#2c818d` | `oklch(55.77% 0.0810 209.26)` | Sea Bed | black, 4.6 to 1 |
| 18 | `#25848a` | `oklch(56.24% 0.0849 201.70)` | Sea Bed | black, 4.7 to 1 |
| 19 | `#1c8785` | `oklch(56.70% 0.0904 193.33)` | Tubbataha Teal | black, 4.8 to 1 |
| 20 | `#148a7f` | `oklch(57.20% 0.0969 184.59)` | Clear Turquoise | black, 4.9 to 1 |
| 21 | `#158d77` | `oklch(57.79% 0.1035 175.91)` | Emerald Enchantment | black, 5.1 to 1 |
| 22 | `#20906f` | `oklch(58.54% 0.1098 167.73)` | Leprechaun | black, 5.2 to 1 |
| 23 | `#2f9367` | `oklch(59.48% 0.1148 160.49)` | Viridian | black, 5.5 to 1 |
| 24 | `#3d9762` | `oklch(60.68% 0.1181 154.63)` | Eucalyptus | black, 5.7 to 1 |
| 25 | `#4a9b60` | `oklch(62.26% 0.1190 150.38)` | Clover Patch | black, 6.1 to 1 |
| 26 | `#57a062` | `oklch(64.34% 0.1182 147.36)` | Mosaic Green | black, 6.6 to 1 |
| 27 | `#64a767` | `oklch(66.75% 0.1160 145.32)` | Endo | black, 7.2 to 1 |
| 28 | `#6faf6e` | `oklch(69.31% 0.1131 144.04)` | Pale Green | black, 8 to 1 |
| 29 | `#7ab677` | `oklch(71.85% 0.1097 143.28)` | Colour Me Green | black, 8.7 to 1 |
| 30 | `#83bd7f` | `oklch(74.19% 0.1064 142.80)` | Greengage | black, 9.5 to 1 |
| 31 | `#8bc385` | `oklch(76.15% 0.1037 142.39)` | Leprechaun Laugh | black, 10.2 to 1 |
| 32 | `#91c78a` | `oklch(77.56% 0.1020 141.80)` | Picnic | black, 10.7 to 1 |

## CSS

```css
background: linear-gradient(90deg, #172944 0.0%, #1b2e4b 3.2%, #203656 6.5%, #274063 9.7%, #2e4a72 12.9%, #355581 16.1%, #3b5f8f 19.4%, #3f689a 22.6%, #406fa1 25.8%, #3f74a4 29.0%, #3d77a3 32.3%, #3b79a1 35.5%, #387b9d 38.7%, #357b98 41.9%, #337c93 45.2%, #307e90 48.4%, #2c818d 51.6%, #25848a 54.8%, #1c8785 58.1%, #148a7f 61.3%, #158d77 64.5%, #20906f 67.7%, #2f9367 71.0%, #3d9762 74.2%, #4a9b60 77.4%, #57a062 80.6%, #64a767 83.9%, #6faf6e 87.1%, #7ab677 90.3%, #83bd7f 93.5%, #8bc385 96.8%, #91c78a 100.0%);
background: linear-gradient(90deg in oklch, oklch(27.95% 0.0551 258.05) 0.0%, oklch(30.10% 0.0586 257.78) 3.2%, oklch(33.14% 0.0636 257.67) 6.5%, oklch(36.76% 0.0697 257.56) 9.7%, oklch(40.68% 0.0761 257.27) 12.9%, oklch(44.58% 0.0823 256.63) 16.1%, oklch(48.16% 0.0878 255.48) 19.4%, oklch(51.12% 0.0919 253.64) 22.6%, oklch(53.18% 0.0940 250.95) 25.8%, oklch(54.42% 0.0939 247.48) 29.0%, oklch(55.09% 0.0920 243.35) 32.3%, oklch(55.33% 0.0890 238.65) 35.5%, oklch(55.31% 0.0855 233.46) 38.7%, oklch(55.20% 0.0823 227.86) 41.9%, oklch(55.14% 0.0801 221.93) 45.2%, oklch(55.30% 0.0794 215.76) 48.4%, oklch(55.77% 0.0810 209.26) 51.6%, oklch(56.24% 0.0849 201.70) 54.8%, oklch(56.70% 0.0904 193.33) 58.1%, oklch(57.20% 0.0969 184.59) 61.3%, oklch(57.79% 0.1035 175.91) 64.5%, oklch(58.54% 0.1098 167.73) 67.7%, oklch(59.48% 0.1148 160.49) 71.0%, oklch(60.68% 0.1181 154.63) 74.2%, oklch(62.26% 0.1190 150.38) 77.4%, oklch(64.34% 0.1182 147.36) 80.6%, oklch(66.75% 0.1160 145.32) 83.9%, oklch(69.31% 0.1131 144.04) 87.1%, oklch(71.85% 0.1097 143.28) 90.3%, oklch(74.19% 0.1064 142.80) 93.5%, oklch(76.15% 0.1037 142.39) 96.8%, oklch(77.56% 0.1020 141.80) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.28 | 0.055 | 258 |
| 2 | 0.528 | 0.094 | 251.7 |
| 3 | 0.555 | 0.08 | 212.6 |
| 4 | 0.61 | 0.119 | 153.4 |
| 5 | 0.776 | 0.102 | 141.8 |

## In these collections

- [Green multicolor gradients](https://grabient.com/green-multicolor-gradients)
- [Alpine harvest embroidery](https://grabient.com/alpine-harvest-embroidery)

## Other forms

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