# Coral teal summer haze

Navy, blue, purple and gray linear gradient with 40 colors: #323f5f, #344266, #36476e, #384e79, #395585, #3b5c91, #3e649e, #426baa, #4b71b5, #5775bf, #6777c4, #7a77c5, #8e76c2, #a176b8, #b177aa, #bb799a, #c07d8a, #c0837c, #bb8973, #b28e6f, #a9926e, #9b946f, #8c9373, #7e9078, #728c7c, #6a867e, #667f7e, #647a7d, #63757b, #637379, #647378, #657479, #67787a, #6b7c7a, #70817b, #77857b, #7f897a, #878c7b, #8e8e7b, #938f7d. Edit it and copy or download CSS, SVG, PNG or shader code.

- Also called: Navy, blue, purple and gray linear gradient
- Seed: `kWXiu-SqvAdWV0tFB9IUoow4`
- Page: https://grabient.com/kWXiu-SqvAdWV0tFB9IUoow4?steps=40&angle=135
- Drawn as: linear gradient, 40 steps, 135 degrees
- Kinds: muted
- Hues: two-hue
- Contrast of its darkest and lightest colors: 3.5 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 | `#323f5f` | `oklch(37.01% 0.0593 267.19)` | Gulf Blue | white, 10.4 to 1 |
| 2 | `#344266` | `oklch(38.40% 0.0635 266.71)` | Black Turmeric | white, 9.9 to 1 |
| 3 | `#36476e` | `oklch(40.26% 0.0698 265.18)` | Hydrogen Blue | white, 9.1 to 1 |
| 4 | `#384e79` | `oklch(42.50% 0.0774 263.09)` | Noble Knight | white, 8.3 to 1 |
| 5 | `#395585` | `oklch(44.99% 0.0858 260.91)` | Southern Blue | white, 7.4 to 1 |
| 6 | `#3b5c91` | `oklch(47.63% 0.0944 259.15)` | Lambent Lagoon | white, 6.6 to 1 |
| 7 | `#3e649e` | `oklch(50.29% 0.1026 258.28)` | Mariner | white, 5.9 to 1 |
| 8 | `#426baa` | `oklch(52.88% 0.1099 258.81)` | Waterline Blue | white, 5.3 to 1 |
| 9 | `#4b71b5` | `oklch(55.27% 0.1155 261.21)` | Sinatra | white, 4.8 to 1 |
| 10 | `#5775bf` | `oklch(57.36% 0.1190 265.99)` | Diva Violet | black, 4.7 to 1 |
| 11 | `#6777c4` | `oklch(59.05% 0.1198 273.62)` | Flood | black, 5 to 1 |
| 12 | `#7a77c5` | `oklch(60.56% 0.1179 284.35)` | Kickstart Purple | black, 5.2 to 1 |
| 13 | `#8e76c2` | `oklch(61.99% 0.1137 297.76)` | Ube | black, 5.5 to 1 |
| 14 | `#a176b8` | `oklch(63.31% 0.1078 313.33)` | Purple Pride | black, 5.7 to 1 |
| 15 | `#b177aa` | `oklch(64.50% 0.1007 330.54)` | Eccentric Magenta | black, 6 to 1 |
| 16 | `#bb799a` | `oklch(65.52% 0.0927 348.85)` | Benifuji | black, 6.3 to 1 |
| 17 | `#c07d8a` | `oklch(66.35% 0.0844 7.75)` | Lipstick Pink | black, 6.5 to 1 |
| 18 | `#c0837c` | `oklch(66.95% 0.0762 26.72)` | Cameo Brown | black, 6.7 to 1 |
| 19 | `#bb8973` | `oklch(67.31% 0.0686 45.23)` | Terrazzo Tan | black, 6.9 to 1 |
| 20 | `#b28e6f` | `oklch(67.39% 0.0620 62.75)` | Poncho | black, 7 to 1 |
| 21 | `#a9926e` | `oklch(67.13% 0.0567 79.34)` | Ecosystem | black, 7 to 1 |
| 22 | `#9b946f` | `oklch(66.28% 0.0516 97.71)` | Sweet Annie | black, 6.8 to 1 |
| 23 | `#8c9373` | `oklch(64.95% 0.0467 117.57)` | Dry Hemlock | black, 6.5 to 1 |
| 24 | `#7e9078` | `oklch(63.28% 0.0419 138.02)` | Mossy Statue | black, 6.1 to 1 |
| 25 | `#728c7c` | `oklch(61.42% 0.0374 158.19)` | Hedge Green | black, 5.7 to 1 |
| 26 | `#6a867e` | `oklch(59.52% 0.0332 177.18)` | Marsh Creek | black, 5.3 to 1 |
| 27 | `#667f7e` | `oklch(57.71% 0.0293 194.12)` | Dark Lagoon | black, 4.9 to 1 |
| 28 | `#647a7d` | `oklch(56.16% 0.0260 208.10)` | Crater Lake | black, 4.5 to 1 |
| 29 | `#63757b` | `oklch(55.00% 0.0232 218.26)` | Sea Beast | white, 4.8 to 1 |
| 30 | `#637379` | `oklch(54.38% 0.0211 223.69)` | Relaxed Navy | white, 4.9 to 1 |
| 31 | `#647378` | `oklch(54.40% 0.0197 223.29)` | Relaxed Navy | white, 4.9 to 1 |
| 32 | `#657479` | `oklch(54.95% 0.0192 216.70)` | Relaxed Navy | white, 4.8 to 1 |
| 33 | `#67787a` | `oklch(55.92% 0.0195 205.18)` | North Grey | white, 4.6 to 1 |
| 34 | `#6b7c7a` | `oklch(57.18% 0.0203 190.06)` | Polar Pond | black, 4.7 to 1 |
| 35 | `#70817b` | `oklch(58.64% 0.0215 172.66)` | Studio Blue Green | black, 5 to 1 |
| 36 | `#77857b` | `oklch(60.19% 0.0230 154.28)` | Limerick | black, 5.4 to 1 |
| 37 | `#7f897a` | `oklch(61.70% 0.0245 136.25)` | Majestic Evergreen | black, 5.7 to 1 |
| 38 | `#878c7b` | `oklch(63.07% 0.0258 119.88)` | Tea Leaf Mouse | black, 6 to 1 |
| 39 | `#8e8e7b` | `oklch(64.20% 0.0269 106.49)` | Meander | black, 6.3 to 1 |
| 40 | `#938f7d` | `oklch(64.96% 0.0276 97.40)` | Muted Sage | black, 6.4 to 1 |

## CSS

```css
background: linear-gradient(135deg, #323f5f 0.0%, #344266 2.6%, #36476e 5.1%, #384e79 7.7%, #395585 10.3%, #3b5c91 12.8%, #3e649e 15.4%, #426baa 17.9%, #4b71b5 20.5%, #5775bf 23.1%, #6777c4 25.6%, #7a77c5 28.2%, #8e76c2 30.8%, #a176b8 33.3%, #b177aa 35.9%, #bb799a 38.5%, #c07d8a 41.0%, #c0837c 43.6%, #bb8973 46.2%, #b28e6f 48.7%, #a9926e 51.3%, #9b946f 53.8%, #8c9373 56.4%, #7e9078 59.0%, #728c7c 61.5%, #6a867e 64.1%, #667f7e 66.7%, #647a7d 69.2%, #63757b 71.8%, #637379 74.4%, #647378 76.9%, #657479 79.5%, #67787a 82.1%, #6b7c7a 84.6%, #70817b 87.2%, #77857b 89.7%, #7f897a 92.3%, #878c7b 94.9%, #8e8e7b 97.4%, #938f7d 100.0%);
background: linear-gradient(135deg in oklch, oklch(37.01% 0.0593 267.19) 0.0%, oklch(38.40% 0.0635 266.71) 2.6%, oklch(40.26% 0.0698 265.18) 5.1%, oklch(42.50% 0.0774 263.09) 7.7%, oklch(44.99% 0.0858 260.91) 10.3%, oklch(47.63% 0.0944 259.15) 12.8%, oklch(50.29% 0.1026 258.28) 15.4%, oklch(52.88% 0.1099 258.81) 17.9%, oklch(55.27% 0.1155 261.21) 20.5%, oklch(57.36% 0.1190 265.99) 23.1%, oklch(59.05% 0.1198 273.62) 25.6%, oklch(60.56% 0.1179 284.35) 28.2%, oklch(61.99% 0.1137 297.76) 30.8%, oklch(63.31% 0.1078 313.33) 33.3%, oklch(64.50% 0.1007 330.54) 35.9%, oklch(65.52% 0.0927 348.85) 38.5%, oklch(66.35% 0.0844 7.75) 41.0%, oklch(66.95% 0.0762 26.72) 43.6%, oklch(67.31% 0.0686 45.23) 46.2%, oklch(67.39% 0.0620 62.75) 48.7%, oklch(67.13% 0.0567 79.34) 51.3%, oklch(66.28% 0.0516 97.71) 53.8%, oklch(64.95% 0.0467 117.57) 56.4%, oklch(63.28% 0.0419 138.02) 59.0%, oklch(61.42% 0.0374 158.19) 61.5%, oklch(59.52% 0.0332 177.18) 64.1%, oklch(57.71% 0.0293 194.12) 66.7%, oklch(56.16% 0.0260 208.10) 69.2%, oklch(55.00% 0.0232 218.26) 71.8%, oklch(54.38% 0.0211 223.69) 74.4%, oklch(54.40% 0.0197 223.29) 76.9%, oklch(54.95% 0.0192 216.70) 79.5%, oklch(55.92% 0.0195 205.18) 82.1%, oklch(57.18% 0.0203 190.06) 84.6%, oklch(58.64% 0.0215 172.66) 87.2%, oklch(60.19% 0.0230 154.28) 89.7%, oklch(61.70% 0.0245 136.25) 92.3%, oklch(63.07% 0.0258 119.88) 94.9%, oklch(64.20% 0.0269 106.49) 97.4%, oklch(64.96% 0.0276 97.40) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.37 | 0.059 | 267.2 |
| 2 | 0.587 | 0.12 | 271.4 |
| 3 | 0.673 | 0.059 | 431 |
| 4 | 0.543 | 0.021 | 584.2 |
| 5 | 0.65 | 0.028 | 457.4 |

## In these collections

- [Late summer lake haze](https://grabient.com/late-summer-lake-haze)

## Other forms

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