# Turquoise blue and teal palette

The Turquoise blue and teal palette brings together blue and teal. The colors span a moderate lightness range, combining moderate color with gentle contrast. Its balanced and composed character suits brand mood boards and editorial graphics. Its lightest and darkest tones both fall within the blue color family.

- Also called: Monochrome gray and blue linear swatches
- Seed: `kYeRnSxZY3FAivzYKcCXa1BN8xQW`
- Page: https://grabient.com/kYeRnSxZY3FAivzYKcCXa1BN8xQW?style=linearSwatches&steps=13
- Drawn as: linear swatches, 13 steps, 90 degrees
- Kinds: vivid, cool
- Hues: analogous
- Contrast of its darkest and lightest colors: 3 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 | `#5e596e` | `oklch(47.64% 0.0344 296.02)` | Orchid Grey | white, 6.7 to 1 |
| 2 | `#58637d` | `oklch(50.03% 0.0431 266.59)` | Award Night | white, 6 to 1 |
| 3 | `#4a7387` | `oklch(53.39% 0.0555 230.38)` | Inky Blue | white, 5.1 to 1 |
| 4 | `#418190` | `oklch(56.75% 0.0690 214.30)` | Casual Blue | black, 4.7 to 1 |
| 5 | `#398ea0` | `oklch(60.34% 0.0844 213.35)` | Scooter | black, 5.5 to 1 |
| 6 | `#329aaf` | `oklch(63.59% 0.0972 214.66)` | Pelorus | black, 6.3 to 1 |
| 7 | `#2ea3bd` | `oklch(66.39% 0.1063 216.23)` | Maui | black, 7 to 1 |
| 8 | `#2eabca` | `oklch(68.84% 0.1131 219.27)` | Ball Blue | black, 7.7 to 1 |
| 9 | `#34b1d7` | `oklch(71.00% 0.1182 222.98)` | Highlighter Blue | black, 8.4 to 1 |
| 10 | `#3eb6e3` | `oklch(72.81% 0.1217 227.58)` | Sail Away | black, 8.9 to 1 |
| 11 | `#47b8ed` | `oklch(74.01% 0.1259 232.63)` | Zima Blue | black, 9.3 to 1 |
| 12 | `#50b7f6` | `oklch(74.55% 0.1312 238.69)` | Glitter Lake | black, 9.4 to 1 |
| 13 | `#57b6fc` | `oklch(74.80% 0.1350 243.18)` | Tiān Lán Sky | black, 9.4 to 1 |

## CSS

```css
background: linear-gradient(90deg, #5e596e 0.000% 7.692%, #58637d 7.692% 15.385%, #4a7387 15.385% 23.077%, #418190 23.077% 30.769%, #398ea0 30.769% 38.462%, #329aaf 38.462% 46.154%, #2ea3bd 46.154% 53.846%, #2eabca 53.846% 61.538%, #34b1d7 61.538% 69.231%, #3eb6e3 69.231% 76.923%, #47b8ed 76.923% 84.615%, #50b7f6 84.615% 92.308%, #57b6fc 92.308% 100.000%);
background: linear-gradient(90deg, oklch(47.64% 0.0344 296.02) 0.000% 7.692%, oklch(50.03% 0.0431 266.59) 7.692% 15.385%, oklch(53.39% 0.0555 230.38) 15.385% 23.077%, oklch(56.75% 0.0690 214.30) 23.077% 30.769%, oklch(60.34% 0.0844 213.35) 30.769% 38.462%, oklch(63.59% 0.0972 214.66) 38.462% 46.154%, oklch(66.39% 0.1063 216.23) 46.154% 53.846%, oklch(68.84% 0.1131 219.27) 53.846% 61.538%, oklch(71.00% 0.1182 222.98) 61.538% 69.231%, oklch(72.81% 0.1217 227.58) 69.231% 76.923%, oklch(74.01% 0.1259 232.63) 76.923% 84.615%, oklch(74.55% 0.1312 238.69) 84.615% 92.308%, oklch(74.80% 0.1350 243.18) 92.308% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.476 | 0.034 | 296 |
| 2 | 0.547 | 0.061 | 221 |
| 3 | 0.63 | 0.095 | 214.6 |
| 4 | 0.693 | 0.114 | 219.9 |
| 5 | 0.736 | 0.124 | 230.5 |
| 6 | 0.748 | 0.135 | 243.2 |

## In these collections

- [Blue and teal swatches](https://grabient.com/blue-and-teal-swatches)
- [Underwater colors](https://grabient.com/underwater-colors)

## Other forms

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