# Blue and deep teal elevation palette

The Blue and deep teal elevation palette brings together blue, green, teal, and off-white. The colors span a broad lightness range, combining restrained color with clear contrast. Its balanced and composed character suits brand mood boards and editorial graphics. Its darkest tone is green, and its lightest tone is off-white.

- Also called: Blue, dark green, teal and gray linear gradient
- Seed: `kUZB2uKZG3D4ZQn1hcMA`
- Page: https://grabient.com/kUZB2uKZG3D4ZQn1hcMA?steps=32&angle=45
- Drawn as: linear gradient, 32 steps, 45 degrees
- Kinds: dark to light, vivid, cool
- Hues: analogous
- Contrast of its darkest and lightest colors: 9.8 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 | `#34495a` | `oklch(39.37% 0.0400 244.69)` | Dilly Blue | white, 9.4 to 1 |
| 2 | `#304858` | `oklch(38.89% 0.0404 239.98)` | Dilly Blue | white, 9.5 to 1 |
| 3 | `#2c4755` | `oklch(38.15% 0.0409 233.44)` | Blue Wing Teal | white, 9.8 to 1 |
| 4 | `#274551` | `oklch(37.23% 0.0414 225.51)` | Rainstorm | white, 10.2 to 1 |
| 5 | `#22434c` | `oklch(36.22% 0.0420 216.68)` | Winter Waves | white, 10.6 to 1 |
| 6 | `#1d4146` | `oklch(35.18% 0.0427 207.41)` | Bay Isle Pointe | white, 11 to 1 |
| 7 | `#193f41` | `oklch(34.21% 0.0435 198.15)` | Sunken Harbour | white, 11.4 to 1 |
| 8 | `#163e3b` | `oklch(33.38% 0.0444 189.39)` | Botanical Night | white, 11.7 to 1 |
| 9 | `#153c36` | `oklch(32.78% 0.0454 181.57)` | Botanical Night | white, 12 to 1 |
| 10 | `#163c33` | `oklch(32.47% 0.0465 175.18)` | Palm Green | white, 12.1 to 1 |
| 11 | `#173c31` | `oklch(32.55% 0.0478 170.66)` | Palm Green | white, 12.1 to 1 |
| 12 | `#183e31` | `oklch(33.02% 0.0494 168.30)` | Mizukaze Green | white, 11.9 to 1 |
| 13 | `#184032` | `oklch(33.68% 0.0517 167.55)` | Mizukaze Green | white, 11.6 to 1 |
| 14 | `#174234` | `oklch(34.54% 0.0545 168.15)` | MSU Green | white, 11.2 to 1 |
| 15 | `#164637` | `oklch(35.60% 0.0577 169.84)` | Sherwood Green | white, 10.7 to 1 |
| 16 | `#144a3c` | `oklch(36.88% 0.0609 172.38)` | Country Squire | white, 10.1 to 1 |
| 17 | `#124e42` | `oklch(38.38% 0.0639 175.51)` | Swedish Green | white, 9.5 to 1 |
| 18 | `#115449` | `oklch(40.13% 0.0666 179.00)` | Breathe Deeply | white, 8.8 to 1 |
| 19 | `#135951` | `oklch(42.13% 0.0685 182.59)` | Baltic Prince | white, 8.1 to 1 |
| 20 | `#176059` | `oklch(44.40% 0.0696 186.04)` | Empress Teal | white, 7.3 to 1 |
| 21 | `#206763` | `oklch(46.96% 0.0696 189.09)` | Butterfly Green | white, 6.5 to 1 |
| 22 | `#2b6f6c` | `oklch(49.83% 0.0683 191.58)` | North Sea | white, 5.8 to 1 |
| 23 | `#397978` | `oklch(53.43% 0.0652 194.13)` | Faded Jade | white, 5 to 1 |
| 24 | `#4b8586` | `oklch(57.68% 0.0607 196.92)` | Sea Caller | black, 4.9 to 1 |
| 25 | `#5e9294` | `oklch(62.42% 0.0552 199.86)` | Pauley | black, 6 to 1 |
| 26 | `#73a0a4` | `oklch(67.43% 0.0489 202.85)` | Delaware Blue Hen | black, 7.2 to 1 |
| 27 | `#88aeb3` | `oklch(72.53% 0.0422 205.81)` | Bon Voyage | black, 8.7 to 1 |
| 28 | `#9dbdc2` | `oklch(77.52% 0.0355 208.66)` | Bel Esprit | black, 10.4 to 1 |
| 29 | `#b0cad0` | `oklch(82.20% 0.0291 211.32)` | Floating Blue | black, 12.2 to 1 |
| 30 | `#c2d7dc` | `oklch(86.40% 0.0233 213.68)` | Falling Tears | black, 13.9 to 1 |
| 31 | `#d1e1e5` | `oklch(89.90% 0.0186 215.68)` | Valley of Tears | black, 15.6 to 1 |
| 32 | `#dce9ed` | `oklch(92.52% 0.0152 217.21)` | Sidewalk Chalk Blue | black, 16.9 to 1 |

## CSS

```css
background: linear-gradient(45deg, #34495a 0.0%, #304858 3.2%, #2c4755 6.5%, #274551 9.7%, #22434c 12.9%, #1d4146 16.1%, #193f41 19.4%, #163e3b 22.6%, #153c36 25.8%, #163c33 29.0%, #173c31 32.3%, #183e31 35.5%, #184032 38.7%, #174234 41.9%, #164637 45.2%, #144a3c 48.4%, #124e42 51.6%, #115449 54.8%, #135951 58.1%, #176059 61.3%, #206763 64.5%, #2b6f6c 67.7%, #397978 71.0%, #4b8586 74.2%, #5e9294 77.4%, #73a0a4 80.6%, #88aeb3 83.9%, #9dbdc2 87.1%, #b0cad0 90.3%, #c2d7dc 93.5%, #d1e1e5 96.8%, #dce9ed 100.0%);
background: linear-gradient(45deg in oklch, oklch(39.37% 0.0400 244.69) 0.0%, oklch(38.89% 0.0404 239.98) 3.2%, oklch(38.15% 0.0409 233.44) 6.5%, oklch(37.23% 0.0414 225.51) 9.7%, oklch(36.22% 0.0420 216.68) 12.9%, oklch(35.18% 0.0427 207.41) 16.1%, oklch(34.21% 0.0435 198.15) 19.4%, oklch(33.38% 0.0444 189.39) 22.6%, oklch(32.78% 0.0454 181.57) 25.8%, oklch(32.47% 0.0465 175.18) 29.0%, oklch(32.55% 0.0478 170.66) 32.3%, oklch(33.02% 0.0494 168.30) 35.5%, oklch(33.68% 0.0517 167.55) 38.7%, oklch(34.54% 0.0545 168.15) 41.9%, oklch(35.60% 0.0577 169.84) 45.2%, oklch(36.88% 0.0609 172.38) 48.4%, oklch(38.38% 0.0639 175.51) 51.6%, oklch(40.13% 0.0666 179.00) 54.8%, oklch(42.13% 0.0685 182.59) 58.1%, oklch(44.40% 0.0696 186.04) 61.3%, oklch(46.96% 0.0696 189.09) 64.5%, oklch(49.83% 0.0683 191.58) 67.7%, oklch(53.43% 0.0652 194.13) 71.0%, oklch(57.68% 0.0607 196.92) 74.2%, oklch(62.42% 0.0552 199.86) 77.4%, oklch(67.43% 0.0489 202.85) 80.6%, oklch(72.53% 0.0422 205.81) 83.9%, oklch(77.52% 0.0355 208.66) 87.1%, oklch(82.20% 0.0291 211.32) 90.3%, oklch(86.40% 0.0233 213.68) 93.5%, oklch(89.90% 0.0186 215.68) 96.8%, oklch(92.52% 0.0152 217.21) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.394 | 0.04 | 244.7 |
| 2 | 0.327 | 0.048 | 169.7 |
| 3 | 0.488 | 0.069 | 190.8 |
| 4 | 0.925 | 0.015 | 217.2 |

## In these collections

- [Elevation gradients](https://grabient.com/elevation-gradients)

## Other forms

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