# Teal and navy turquoise palette

The Teal and navy turquoise palette brings together teal, blue, and dark blue. 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 teal.

- Also called: Duotone teal to navy linear gradient
- Seed: `kUyF-HzCbDDYgw8kHUPg`
- Page: https://grabient.com/kUyF-HzCbDDYgw8kHUPg?steps=32&angle=270
- Drawn as: linear gradient, 32 steps, 270 degrees
- Kinds: light to dark, vivid, cool
- Hues: wide
- Contrast of its darkest and lightest colors: 7.9 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 | `#22d4cd` | `oklch(78.74% 0.1309 190.55)` | Turquoise Panic | black, 11.3 to 1 |
| 2 | `#1ed0cb` | `oklch(77.65% 0.1294 192.03)` | Blue Martina | black, 10.9 to 1 |
| 3 | `#18cbc9` | `oklch(76.25% 0.1275 193.90)` | Tilla Kari Mosque | black, 10.3 to 1 |
| 4 | `#11c5c7` | `oklch(74.59% 0.1253 196.10)` | Turquoise Surf | black, 9.7 to 1 |
| 5 | `#09bec3` | `oklch(72.73% 0.1227 198.56)` | Maximum Blue Green | black, 9.1 to 1 |
| 6 | `#02b6c0` | `oklch(70.72% 0.1200 201.24)` | Lago Blue | black, 8.4 to 1 |
| 7 | `#00afbb` | `oklch(68.62% 0.1170 204.09)` | Deep Turquoise | black, 7.8 to 1 |
| 8 | `#00a7b7` | `oklch(66.49% 0.1140 207.05)` | Bluebird | black, 7.1 to 1 |
| 9 | `#009fb3` | `oklch(64.38% 0.1114 210.06)` | Lake Blue | black, 6.6 to 1 |
| 10 | `#0098ae` | `oklch(62.34% 0.1091 213.05)` | Aquarium Diver | black, 6 to 1 |
| 11 | `#0391aa` | `oklch(60.44% 0.1068 216.00)` | Cape Pond | black, 5.6 to 1 |
| 12 | `#078aa6` | `oklch(58.67% 0.1048 218.90)` | Capri Breeze | black, 5.2 to 1 |
| 13 | `#0b84a2` | `oklch(56.92% 0.1029 221.88)` | Blue Arc | black, 4.8 to 1 |
| 14 | `#0f7e9e` | `oklch(55.18% 0.1011 224.94)` | Turkish Tile | white, 4.6 to 1 |
| 15 | `#13789a` | `oklch(53.45% 0.0993 228.08)` | Sea Sight | white, 5 to 1 |
| 16 | `#167196` | `oklch(51.74% 0.0977 231.27)` | Enchanted Blue | white, 5.4 to 1 |
| 17 | `#196b92` | `oklch(50.04% 0.0961 234.50)` | Cairns | white, 5.8 to 1 |
| 18 | `#1c658d` | `oklch(48.37% 0.0946 237.77)` | Traditional Blue | white, 6.3 to 1 |
| 19 | `#1e6089` | `oklch(46.73% 0.0931 241.04)` | Copenhagen Blue | white, 6.8 to 1 |
| 20 | `#205a85` | `oklch(45.12% 0.0918 244.31)` | Oceanic Motion | white, 7.3 to 1 |
| 21 | `#225580` | `oklch(43.55% 0.0904 247.57)` | Blueberry Twist | white, 7.8 to 1 |
| 22 | `#234f7c` | `oklch(42.01% 0.0891 250.82)` | Slumber | white, 8.4 to 1 |
| 23 | `#244a77` | `oklch(40.43% 0.0879 254.28)` | Sapphire Earrings | white, 9 to 1 |
| 24 | `#254472` | `oklch(38.83% 0.0867 257.96)` | Cold Current | white, 9.7 to 1 |
| 25 | `#263f6d` | `oklch(37.22% 0.0856 261.75)` | Limoges | white, 10.4 to 1 |
| 26 | `#273a68` | `oklch(35.63% 0.0845 265.56)` | Blue Depths | white, 11.1 to 1 |
| 27 | `#273563` | `oklch(34.10% 0.0836 269.29)` | Navy Trim | white, 11.8 to 1 |
| 28 | `#27305e` | `oklch(32.66% 0.0826 272.86)` | Underwater Realm | white, 12.5 to 1 |
| 29 | `#272c5a` | `oklch(31.33% 0.0818 276.16)` | Deep Sea Base | white, 13.2 to 1 |
| 30 | `#272856` | `oklch(30.15% 0.0811 279.11)` | Ceremonial Purple | white, 13.8 to 1 |
| 31 | `#262552` | `oklch(29.15% 0.0804 281.60)` | Pāua | white, 14.3 to 1 |
| 32 | `#26224f` | `oklch(28.35% 0.0799 283.54)` | Pāua | white, 14.7 to 1 |

## CSS

```css
background: linear-gradient(270deg, #22d4cd 0.0%, #1ed0cb 3.2%, #18cbc9 6.5%, #11c5c7 9.7%, #09bec3 12.9%, #02b6c0 16.1%, #00afbb 19.4%, #00a7b7 22.6%, #009fb3 25.8%, #0098ae 29.0%, #0391aa 32.3%, #078aa6 35.5%, #0b84a2 38.7%, #0f7e9e 41.9%, #13789a 45.2%, #167196 48.4%, #196b92 51.6%, #1c658d 54.8%, #1e6089 58.1%, #205a85 61.3%, #225580 64.5%, #234f7c 67.7%, #244a77 71.0%, #254472 74.2%, #263f6d 77.4%, #273a68 80.6%, #273563 83.9%, #27305e 87.1%, #272c5a 90.3%, #272856 93.5%, #262552 96.8%, #26224f 100.0%);
background: linear-gradient(270deg in oklch, oklch(78.74% 0.1309 190.55) 0.0%, oklch(77.65% 0.1294 192.03) 3.2%, oklch(76.25% 0.1275 193.90) 6.5%, oklch(74.59% 0.1253 196.10) 9.7%, oklch(72.73% 0.1227 198.56) 12.9%, oklch(70.72% 0.1200 201.24) 16.1%, oklch(68.62% 0.1170 204.09) 19.4%, oklch(66.49% 0.1140 207.05) 22.6%, oklch(64.38% 0.1114 210.06) 25.8%, oklch(62.34% 0.1091 213.05) 29.0%, oklch(60.44% 0.1068 216.00) 32.3%, oklch(58.67% 0.1048 218.90) 35.5%, oklch(56.92% 0.1029 221.88) 38.7%, oklch(55.18% 0.1011 224.94) 41.9%, oklch(53.45% 0.0993 228.08) 45.2%, oklch(51.74% 0.0977 231.27) 48.4%, oklch(50.04% 0.0961 234.50) 51.6%, oklch(48.37% 0.0946 237.77) 54.8%, oklch(46.73% 0.0931 241.04) 58.1%, oklch(45.12% 0.0918 244.31) 61.3%, oklch(43.55% 0.0904 247.57) 64.5%, oklch(42.01% 0.0891 250.82) 67.7%, oklch(40.43% 0.0879 254.28) 71.0%, oklch(38.83% 0.0867 257.96) 74.2%, oklch(37.22% 0.0856 261.75) 77.4%, oklch(35.63% 0.0845 265.56) 80.6%, oklch(34.10% 0.0836 269.29) 83.9%, oklch(32.66% 0.0826 272.86) 87.1%, oklch(31.33% 0.0818 276.16) 90.3%, oklch(30.15% 0.0811 279.11) 93.5%, oklch(29.15% 0.0804 281.60) 96.8%, oklch(28.35% 0.0799 283.54) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.787 | 0.131 | 190.5 |
| 2 | 0.598 | 0.106 | 217 |
| 3 | 0.425 | 0.09 | 249.7 |
| 4 | 0.283 | 0.08 | 283.5 |

## In these collections

- [Turquoise](https://grabient.com/turquoise)

## Other forms

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