# Teal text palette

The Teal text palette brings together dark blue and teal. The colors span a moderate lightness range, combining restrained color with gentle contrast. Its balanced and composed character suits website sections and interface mockups. Its darkest tone is dark blue, and its lightest tone is teal.

- Also called: Analogous navy to teal radial gradient
- Seed: `kSQyOmNxc9k2Yvc`
- Page: https://grabient.com/kSQyOmNxc9k2Yvc?style=radialGradient&steps=32&angle=0
- Drawn as: radial gradient, 32 steps, 0 degrees
- Kinds: dark to light, vivid, cool
- Hues: analogous
- Contrast of its darkest and lightest colors: 4.1 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 | `#062939` | `oklch(26.38% 0.0482 233.44)` | Murky Depths | white, 15.2 to 1 |
| 2 | `#072a3a` | `oklch(26.99% 0.0488 232.70)` | Murky Depths | white, 14.9 to 1 |
| 3 | `#082c3c` | `oklch(27.73% 0.0495 231.81)` | Oceanic Noir | white, 14.5 to 1 |
| 4 | `#092f3f` | `oklch(28.58% 0.0504 230.78)` | NATO Blue | white, 14.1 to 1 |
| 5 | `#093141` | `oklch(29.52% 0.0513 229.63)` | Nordic Noir | white, 13.7 to 1 |
| 6 | `#0b3444` | `oklch(30.56% 0.0524 228.37)` | Crowberry Blue | white, 13.2 to 1 |
| 7 | `#0c3747` | `oklch(31.66% 0.0535 227.03)` | Crowberry Blue | white, 12.6 to 1 |
| 8 | `#0d3b4a` | `oklch(32.83% 0.0547 225.62)` | Ghostlands Coal | white, 12.1 to 1 |
| 9 | `#0f3e4d` | `oklch(34.04% 0.0558 224.15)` | Cold and Dark | white, 11.5 to 1 |
| 10 | `#104251` | `oklch(35.29% 0.0570 222.65)` | Cold and Dark | white, 10.9 to 1 |
| 11 | `#124554` | `oklch(36.55% 0.0582 221.14)` | Sultan’s Silk | white, 10.4 to 1 |
| 12 | `#144958` | `oklch(37.83% 0.0593 219.63)` | Ethereal Dance | white, 9.8 to 1 |
| 13 | `#164d5b` | `oklch(39.10% 0.0604 218.15)` | Teal Dark Blue | white, 9.3 to 1 |
| 14 | `#18515e` | `oklch(40.35% 0.0614 216.70)` | Genetic Code | white, 8.8 to 1 |
| 15 | `#1a5461` | `oklch(41.57% 0.0623 215.30)` | Uncharted | white, 8.4 to 1 |
| 16 | `#1c5864` | `oklch(42.74% 0.0631 213.99)` | Baltic Trench | white, 7.9 to 1 |
| 17 | `#1f5b67` | `oklch(43.88% 0.0637 212.74)` | Legion Blue | white, 7.6 to 1 |
| 18 | `#215f6a` | `oklch(45.07% 0.0642 211.46)` | Excellence | white, 7.2 to 1 |
| 19 | `#24636d` | `oklch(46.31% 0.0647 210.15)` | Pacific | white, 6.8 to 1 |
| 20 | `#286770` | `oklch(47.60% 0.0651 208.81)` | Mordant Blue | white, 6.4 to 1 |
| 21 | `#2b6b73` | `oklch(48.92% 0.0655 207.45)` | Antigua | white, 6.1 to 1 |
| 22 | `#2f6f76` | `oklch(50.26% 0.0658 206.10)` | Lakelike | white, 5.7 to 1 |
| 23 | `#32737a` | `oklch(51.59% 0.0661 204.76)` | King Tide | white, 5.4 to 1 |
| 24 | `#36777d` | `oklch(52.90% 0.0663 203.44)` | Diver’s Eden | white, 5.1 to 1 |
| 25 | `#3a7b80` | `oklch(54.18% 0.0665 202.17)` | Blue Venus | white, 4.8 to 1 |
| 26 | `#3d7f83` | `oklch(55.42% 0.0667 200.95)` | Pacific Sea Teal | white, 4.6 to 1 |
| 27 | `#418286` | `oklch(56.59% 0.0669 199.79)` | Pacific Sea Teal | black, 4.7 to 1 |
| 28 | `#448688` | `oklch(57.69% 0.0670 198.70)` | Sea Caller | black, 4.9 to 1 |
| 29 | `#47898b` | `oklch(58.70% 0.0671 197.71)` | Sea Caller | black, 5.2 to 1 |
| 30 | `#4a8c8d` | `oklch(59.60% 0.0673 196.82)` | Evora | black, 5.4 to 1 |
| 31 | `#4c8e8e` | `oklch(60.38% 0.0674 196.04)` | Blue Chill | black, 5.5 to 1 |
| 32 | `#4e9090` | `oklch(61.02% 0.0675 195.39)` | Bristol Blue | black, 5.7 to 1 |

## CSS

```css
background: radial-gradient(circle at 50% 50%, #062939 0.0%, #072a3a 3.2%, #082c3c 6.5%, #092f3f 9.7%, #093141 12.9%, #0b3444 16.1%, #0c3747 19.4%, #0d3b4a 22.6%, #0f3e4d 25.8%, #104251 29.0%, #124554 32.3%, #144958 35.5%, #164d5b 38.7%, #18515e 41.9%, #1a5461 45.2%, #1c5864 48.4%, #1f5b67 51.6%, #215f6a 54.8%, #24636d 58.1%, #286770 61.3%, #2b6b73 64.5%, #2f6f76 67.7%, #32737a 71.0%, #36777d 74.2%, #3a7b80 77.4%, #3d7f83 80.6%, #418286 83.9%, #448688 87.1%, #47898b 90.3%, #4a8c8d 93.5%, #4c8e8e 96.8%, #4e9090 100.0%);
background: radial-gradient(circle at 50% 50% in oklch, oklch(26.38% 0.0482 233.44) 0.0%, oklch(26.99% 0.0488 232.70) 3.2%, oklch(27.73% 0.0495 231.81) 6.5%, oklch(28.58% 0.0504 230.78) 9.7%, oklch(29.52% 0.0513 229.63) 12.9%, oklch(30.56% 0.0524 228.37) 16.1%, oklch(31.66% 0.0535 227.03) 19.4%, oklch(32.83% 0.0547 225.62) 22.6%, oklch(34.04% 0.0558 224.15) 25.8%, oklch(35.29% 0.0570 222.65) 29.0%, oklch(36.55% 0.0582 221.14) 32.3%, oklch(37.83% 0.0593 219.63) 35.5%, oklch(39.10% 0.0604 218.15) 38.7%, oklch(40.35% 0.0614 216.70) 41.9%, oklch(41.57% 0.0623 215.30) 45.2%, oklch(42.74% 0.0631 213.99) 48.4%, oklch(43.88% 0.0637 212.74) 51.6%, oklch(45.07% 0.0642 211.46) 54.8%, oklch(46.31% 0.0647 210.15) 58.1%, oklch(47.60% 0.0651 208.81) 61.3%, oklch(48.92% 0.0655 207.45) 64.5%, oklch(50.26% 0.0658 206.10) 67.7%, oklch(51.59% 0.0661 204.76) 71.0%, oklch(52.90% 0.0663 203.44) 74.2%, oklch(54.18% 0.0665 202.17) 77.4%, oklch(55.42% 0.0667 200.95) 80.6%, oklch(56.59% 0.0669 199.79) 83.9%, oklch(57.69% 0.0670 198.70) 87.1%, oklch(58.70% 0.0671 197.71) 90.3%, oklch(59.60% 0.0673 196.82) 93.5%, oklch(60.38% 0.0674 196.04) 96.8%, oklch(61.02% 0.0675 195.39) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.264 | 0.048 | 233.4 |
| 2 | 0.433 | 0.063 | 213.4 |
| 3 | 0.61 | 0.068 | 195.4 |

## In these collections

- [Text gradients](https://grabient.com/text-gradients)

## Other forms

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