# Teal and indigo color palette

The Teal and indigo color palette brings together green, light teal, teal, and blue. The colors span a moderate lightness range, combining moderate color with clear contrast. Its balanced and composed character suits travel posters and environmental mood boards. Its darkest tone is blue, and its lightest tone is light teal.

- Also called: Cool green, teal and blue linear gradient
- Seed: `kcdEZyySnAdkuQHlpED3KRDE4qw6-LcIsKdBY`
- Page: https://grabient.com/kcdEZyySnAdkuQHlpED3KRDE4qw6-LcIsKdBY?steps=32
- Drawn as: linear gradient, 32 steps, 90 degrees
- Kinds: light center, vivid, cool
- Hues: wide
- Contrast of its darkest and lightest colors: 5.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 | `#0f6745` | `oklch(45.67% 0.0965 161.02)` | Jewel | white, 6.8 to 1 |
| 2 | `#106d4a` | `oklch(47.52% 0.0994 161.68)` | Into the Green | white, 6.3 to 1 |
| 3 | `#127652` | `oklch(50.16% 0.1036 162.64)` | Greasy Greens | white, 5.6 to 1 |
| 4 | `#14805b` | `oklch(53.20% 0.1084 163.73)` | Spanish Viridian | white, 4.9 to 1 |
| 5 | `#168a64` | `oklch(56.26% 0.1128 164.82)` | Kabalite Green | black, 4.8 to 1 |
| 6 | `#1a936d` | `oklch(59.09% 0.1165 165.76)` | Viridian | black, 5.4 to 1 |
| 7 | `#1d9d76` | `oklch(62.00% 0.1208 166.57)` | Holly Green | black, 6.1 to 1 |
| 8 | `#21a77f` | `oklch(64.95% 0.1247 167.40)` | Active Green | black, 6.8 to 1 |
| 9 | `#28b089` | `oklch(67.80% 0.1270 168.39)` | Jess | black, 7.6 to 1 |
| 10 | `#32b993` | `oklch(70.45% 0.1265 169.67)` | Mountain Meadow | black, 8.4 to 1 |
| 11 | `#43c19e` | `oklch(73.23% 0.1218 170.91)` | New Meadow | black, 9.3 to 1 |
| 12 | `#56c9a9` | `oklch(76.04% 0.1143 172.20)` | Mermaid’s Kiss | black, 10.3 to 1 |
| 13 | `#66cfb3` | `oklch(78.38% 0.1064 174.03)` | Sweet Garden | black, 11.1 to 1 |
| 14 | `#6fd2bc` | `oklch(79.77% 0.1003 176.86)` | Downy | black, 11.6 to 1 |
| 15 | `#6ed2c1` | `oklch(79.79% 0.0975 181.11)` | Downy | black, 11.6 to 1 |
| 16 | `#68cec3` | `oklch(78.61% 0.0964 186.60)` | Dip in the Pool | black, 11.1 to 1 |
| 17 | `#5fc7c4` | `oklch(76.67% 0.0966 192.91)` | Chinese Lacquer | black, 10.4 to 1 |
| 18 | `#54bfc4` | `oklch(74.41% 0.0979 199.59)` | Gem Turquoise | black, 9.6 to 1 |
| 19 | `#4ab7c4` | `oklch(72.22% 0.0999 206.26)` | Cave Lake | black, 8.8 to 1 |
| 20 | `#3faec5` | `oklch(69.87% 0.1034 213.54)` | River Blue | black, 8.1 to 1 |
| 21 | `#35a5c5` | `oklch(67.28% 0.1080 221.20)` | Laguna | black, 7.3 to 1 |
| 22 | `#2e9ac4` | `oklch(64.55% 0.1127 228.63)` | Stratos Blue | black, 6.5 to 1 |
| 23 | `#2b90c1` | `oklch(61.81% 0.1167 235.21)` | Porpita Porpita | black, 5.8 to 1 |
| 24 | `#2985bd` | `oklch(59.02% 0.1197 240.62)` | Pat-A-Pep | black, 5.1 to 1 |
| 25 | `#277ab8` | `oklch(56.12% 0.1226 245.24)` | Haddock’s Sweater | white, 4.5 to 1 |
| 26 | `#2670b1` | `oklch(53.19% 0.1248 249.30)` | Planetarium | white, 5.2 to 1 |
| 27 | `#2666a9` | `oklch(50.36% 0.1257 253.01)` | Barbados Blue | white, 5.9 to 1 |
| 28 | `#285ca1` | `oklch(47.67% 0.1246 256.60)` | Miracle at Wrigley | white, 6.6 to 1 |
| 29 | `#2a5397` | `oklch(44.87% 0.1209 260.07)` | Insignia | white, 7.5 to 1 |
| 30 | `#2b4a8c` | `oklch(42.16% 0.1158 263.24)` | Blue Highlight | white, 8.5 to 1 |
| 31 | `#2b4382` | `oklch(39.83% 0.1108 265.87)` | Official Violet | white, 9.4 to 1 |
| 32 | `#2a3e7b` | `oklch(38.19% 0.1075 267.75)` | Mazarine Blue | white, 10.1 to 1 |

## CSS

```css
background: linear-gradient(90deg, #0f6745 0.0%, #106d4a 3.2%, #127652 6.5%, #14805b 9.7%, #168a64 12.9%, #1a936d 16.1%, #1d9d76 19.4%, #21a77f 22.6%, #28b089 25.8%, #32b993 29.0%, #43c19e 32.3%, #56c9a9 35.5%, #66cfb3 38.7%, #6fd2bc 41.9%, #6ed2c1 45.2%, #68cec3 48.4%, #5fc7c4 51.6%, #54bfc4 54.8%, #4ab7c4 58.1%, #3faec5 61.3%, #35a5c5 64.5%, #2e9ac4 67.7%, #2b90c1 71.0%, #2985bd 74.2%, #277ab8 77.4%, #2670b1 80.6%, #2666a9 83.9%, #285ca1 87.1%, #2a5397 90.3%, #2b4a8c 93.5%, #2b4382 96.8%, #2a3e7b 100.0%);
background: linear-gradient(90deg in oklch, oklch(45.67% 0.0965 161.02) 0.0%, oklch(47.52% 0.0994 161.68) 3.2%, oklch(50.16% 0.1036 162.64) 6.5%, oklch(53.20% 0.1084 163.73) 9.7%, oklch(56.26% 0.1128 164.82) 12.9%, oklch(59.09% 0.1165 165.76) 16.1%, oklch(62.00% 0.1208 166.57) 19.4%, oklch(64.95% 0.1247 167.40) 22.6%, oklch(67.80% 0.1270 168.39) 25.8%, oklch(70.45% 0.1265 169.67) 29.0%, oklch(73.23% 0.1218 170.91) 32.3%, oklch(76.04% 0.1143 172.20) 35.5%, oklch(78.38% 0.1064 174.03) 38.7%, oklch(79.77% 0.1003 176.86) 41.9%, oklch(79.79% 0.0975 181.11) 45.2%, oklch(78.61% 0.0964 186.60) 48.4%, oklch(76.67% 0.0966 192.91) 51.6%, oklch(74.41% 0.0979 199.59) 54.8%, oklch(72.22% 0.0999 206.26) 58.1%, oklch(69.87% 0.1034 213.54) 61.3%, oklch(67.28% 0.1080 221.20) 64.5%, oklch(64.55% 0.1127 228.63) 67.7%, oklch(61.81% 0.1167 235.21) 71.0%, oklch(59.02% 0.1197 240.62) 74.2%, oklch(56.12% 0.1226 245.24) 77.4%, oklch(53.19% 0.1248 249.30) 80.6%, oklch(50.36% 0.1257 253.01) 83.9%, oklch(47.67% 0.1246 256.60) 87.1%, oklch(44.87% 0.1209 260.07) 90.3%, oklch(42.16% 0.1158 263.24) 93.5%, oklch(39.83% 0.1108 265.87) 96.8%, oklch(38.19% 0.1075 267.75) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.457 | 0.096 | 161 |
| 2 | 0.575 | 0.114 | 165.2 |
| 3 | 0.701 | 0.127 | 169.5 |
| 4 | 0.799 | 0.099 | 177.9 |
| 5 | 0.728 | 0.099 | 204.3 |
| 6 | 0.614 | 0.117 | 236 |
| 7 | 0.488 | 0.125 | 255.1 |
| 8 | 0.382 | 0.107 | 267.7 |

## In these collections

- [Ocean gradients](https://grabient.com/ocean-gradients)
- [Navy and teal gradients](https://grabient.com/navy-and-teal-gradients)
- [Blue and green gradients](https://grabient.com/blue-and-green-gradients)

## Other forms

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