# Blue gray teal berry diagonal

Blue, gray, teal and purple linear gradient with 64 colors: #003478, #013a7b, #03417f, #084a84, #115489, #1c5e8e, #276994, #347499, #427e9f, #5089a5, #5d93aa, #6b9cb0, #77a5b5, #82acb9, #8bb2bd, #92b6c0, #96b8c2, #98b9c3, #98b8c3, #97b6c3, #94b3c2, #90aec0, #8ca9bd, #87a3ba, #829db7, #7e96b4, #7a8fb0, #7689ad, #7283a9, #6f7da6, #6c79a3, #6975a0, #66739f, #63729e, #5e729e, #59739d, #53759d, #4c769c, #46789a, #3f7a98, #397c95, #337e91, #2f7f8d, #2c8089, #298086, #278083, #247e81, #207c7f, #1a797f, #157580, #127082, #166a83, #1e6383, #285b83, #325380, #3a4a7c, #414175, #47396c, #4b3162, #4d2a57, #4e244c, #4f1f42, #4e1b3a, #4d1833. Edit it and copy or download CSS, SVG, PNG or shader code.

- Also called: Blue, gray, teal and purple linear gradient
- Seed: `kWV1y34I67MgZRlEHjdJp_SA`
- Page: https://grabient.com/kWV1y34I67MgZRlEHjdJp_SA?steps=64&angle=135
- Drawn as: linear gradient, 64 steps, 135 degrees
- Kinds: light center, cool
- Hues: analogous
- Contrast of its darkest and lightest colors: 6.7 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 | `#003478` | `oklch(34.25% 0.1268 258.05)` | Dark Midnight Blue | white, 11.8 to 1 |
| 2 | `#013a7b` | `oklch(35.85% 0.1235 256.44)` | Azure Dragon | white, 11 to 1 |
| 3 | `#03417f` | `oklch(37.96% 0.1191 254.23)` | Bracing Blue | white, 10.1 to 1 |
| 4 | `#084a84` | `oklch(40.49% 0.1140 251.52)` | Dance Studio | white, 9 to 1 |
| 5 | `#115489` | `oklch(43.37% 0.1081 248.42)` | Dark Denim | white, 7.9 to 1 |
| 6 | `#1c5e8e` | `oklch(46.51% 0.1017 245.03)` | Sapphire Lace | white, 6.9 to 1 |
| 7 | `#276994` | `oklch(49.84% 0.0948 241.46)` | Blue Oasis | white, 5.9 to 1 |
| 8 | `#347499` | `oklch(53.29% 0.0878 237.79)` | Male Betta | white, 5.1 to 1 |
| 9 | `#427e9f` | `oklch(56.76% 0.0807 234.15)` | Linoleum Blue | black, 4.7 to 1 |
| 10 | `#5089a5` | `oklch(60.18% 0.0736 230.63)` | Secure Blue | black, 5.4 to 1 |
| 11 | `#5d93aa` | `oklch(63.47% 0.0668 227.33)` | Blue Persia | black, 6.2 to 1 |
| 12 | `#6b9cb0` | `oklch(66.56% 0.0604 224.36)` | Bluebird Feather | black, 7 to 1 |
| 13 | `#77a5b5` | `oklch(69.36% 0.0545 221.82)` | Inner Sanctum | black, 7.8 to 1 |
| 14 | `#82acb9` | `oklch(71.80% 0.0493 219.81)` | Summerhouse Blue | black, 8.5 to 1 |
| 15 | `#8bb2bd` | `oklch(73.80% 0.0450 218.44)` | Thistleblossom Soft Blue | black, 9.1 to 1 |
| 16 | `#92b6c0` | `oklch(75.27% 0.0417 217.81)` | Tahoe Blue | black, 9.6 to 1 |
| 17 | `#96b8c2` | `oklch(76.15% 0.0395 218.04)` | Tahoe Blue | black, 9.9 to 1 |
| 18 | `#98b9c3` | `oklch(76.46% 0.0384 219.37)` | Shallow Sea | black, 10 to 1 |
| 19 | `#98b8c3` | `oklch(76.29% 0.0382 221.76)` | Shallow Sea | black, 9.9 to 1 |
| 20 | `#97b6c3` | `oklch(75.70% 0.0387 225.04)` | Peaceful Blue | black, 9.7 to 1 |
| 21 | `#94b3c2` | `oklch(74.74% 0.0398 229.04)` | Bright Bluebonnet | black, 9.4 to 1 |
| 22 | `#90aec0` | `oklch(73.48% 0.0416 233.59)` | Thermocline | black, 9 to 1 |
| 23 | `#8ca9bd` | `oklch(71.97% 0.0438 238.51)` | Coventry Blue | black, 8.5 to 1 |
| 24 | `#87a3ba` | `oklch(70.27% 0.0464 243.64)` | Hawaiian Sky | black, 7.9 to 1 |
| 25 | `#829db7` | `oklch(68.45% 0.0492 248.82)` | Office Blue | black, 7.4 to 1 |
| 26 | `#7e96b4` | `oklch(66.56% 0.0522 253.86)` | Denim Tradition | black, 6.9 to 1 |
| 27 | `#7a8fb0` | `oklch(64.66% 0.0553 258.61)` | Ashton Skies | black, 6.4 to 1 |
| 28 | `#7689ad` | `oklch(62.81% 0.0584 262.89)` | Ship Cove | black, 5.9 to 1 |
| 29 | `#7283a9` | `oklch(61.07% 0.0613 266.53)` | Berwick Berry | black, 5.5 to 1 |
| 30 | `#6f7da6` | `oklch(59.50% 0.0639 269.36)` | Night Thistle | black, 5.1 to 1 |
| 31 | `#6c79a3` | `oklch(58.15% 0.0663 271.21)` | Night Thistle | black, 4.8 to 1 |
| 32 | `#6975a0` | `oklch(57.09% 0.0681 271.91)` | Blue Batik | black, 4.6 to 1 |
| 33 | `#66739f` | `oklch(56.36% 0.0696 271.25)` | Blue Batik | white, 4.6 to 1 |
| 34 | `#63729e` | `oklch(55.85% 0.0708 268.86)` | Blueberry Patch | white, 4.7 to 1 |
| 35 | `#5e729e` | `oklch(55.50% 0.0720 264.94)` | Blueberry Patch | white, 4.7 to 1 |
| 36 | `#59739d` | `oklch(55.29% 0.0732 259.76)` | Secrecy | white, 4.8 to 1 |
| 37 | `#53759d` | `oklch(55.20% 0.0742 253.60)` | Secrecy | white, 4.7 to 1 |
| 38 | `#4c769c` | `oklch(55.20% 0.0752 246.73)` | Dull Blue | white, 4.7 to 1 |
| 39 | `#46789a` | `oklch(55.25% 0.0761 239.41)` | Cry Me a River | white, 4.7 to 1 |
| 40 | `#3f7a98` | `oklch(55.33% 0.0770 231.92)` | Sea Swirl | white, 4.6 to 1 |
| 41 | `#397c95` | `oklch(55.42% 0.0778 224.52)` | Blue Rodeo | white, 4.6 to 1 |
| 42 | `#337e91` | `oklch(55.48% 0.0786 217.50)` | Larkspur | white, 4.6 to 1 |
| 43 | `#2f7f8d` | `oklch(55.48% 0.0794 211.12)` | Sea Swimmer | white, 4.6 to 1 |
| 44 | `#2c8089` | `oklch(55.41% 0.0801 205.65)` | Sea Swimmer | white, 4.6 to 1 |
| 45 | `#298086` | `oklch(55.23% 0.0807 201.36)` | Cranach Blue | white, 4.6 to 1 |
| 46 | `#278083` | `oklch(54.91% 0.0813 198.53)` | Jade Jewel | white, 4.6 to 1 |
| 47 | `#247e81` | `oklch(54.42% 0.0820 197.42)` | Jade Jewel | white, 4.7 to 1 |
| 48 | `#207c7f` | `oklch(53.75% 0.0825 198.30)` | Jade Jewel | white, 4.9 to 1 |
| 49 | `#1a797f` | `oklch(52.85% 0.0831 201.45)` | Blue Kelp | white, 5.1 to 1 |
| 50 | `#157580` | `oklch(51.72% 0.0836 206.81)` | Night Scape | white, 5.3 to 1 |
| 51 | `#127082` | `oklch(50.39% 0.0840 214.10)` | Billabong | white, 5.7 to 1 |
| 52 | `#166a83` | `oklch(48.90% 0.0844 223.03)` | Arabian Nights | white, 6.1 to 1 |
| 53 | `#1e6383` | `oklch(47.28% 0.0848 233.31)` | Blue Sapphire | white, 6.6 to 1 |
| 54 | `#285b83` | `oklch(45.56% 0.0851 244.65)` | Oceanic Motion | white, 7.2 to 1 |
| 55 | `#325380` | `oklch(43.77% 0.0853 256.76)` | St. Tropez | white, 7.8 to 1 |
| 56 | `#3a4a7c` | `oklch(41.96% 0.0856 269.33)` | Expressionism | white, 8.5 to 1 |
| 57 | `#414175` | `oklch(40.15% 0.0858 282.10)` | Deep Wisteria | white, 9.3 to 1 |
| 58 | `#47396c` | `oklch(38.37% 0.0860 294.75)` | Meteorite | white, 10.1 to 1 |
| 59 | `#4b3162` | `oklch(36.66% 0.0861 307.01)` | Petunia | white, 10.9 to 1 |
| 60 | `#4d2a57` | `oklch(35.06% 0.0863 318.57)` | Deep Plum | white, 11.7 to 1 |
| 61 | `#4e244c` | `oklch(33.58% 0.0864 329.15)` | Murasaki | white, 12.4 to 1 |
| 62 | `#4f1f42` | `oklch(32.28% 0.0866 338.46)` | Prestige Mauve | white, 13 to 1 |
| 63 | `#4e1b3a` | `oklch(31.18% 0.0867 346.21)` | Tulip Poplar Purple | white, 13.6 to 1 |
| 64 | `#4d1833` | `oklch(30.31% 0.0868 352.10)` | Chilli Black Red | white, 14 to 1 |

## CSS

```css
background: linear-gradient(135deg, #003478 0.0%, #013a7b 1.6%, #03417f 3.2%, #084a84 4.8%, #115489 6.3%, #1c5e8e 7.9%, #276994 9.5%, #347499 11.1%, #427e9f 12.7%, #5089a5 14.3%, #5d93aa 15.9%, #6b9cb0 17.5%, #77a5b5 19.0%, #82acb9 20.6%, #8bb2bd 22.2%, #92b6c0 23.8%, #96b8c2 25.4%, #98b9c3 27.0%, #98b8c3 28.6%, #97b6c3 30.2%, #94b3c2 31.7%, #90aec0 33.3%, #8ca9bd 34.9%, #87a3ba 36.5%, #829db7 38.1%, #7e96b4 39.7%, #7a8fb0 41.3%, #7689ad 42.9%, #7283a9 44.4%, #6f7da6 46.0%, #6c79a3 47.6%, #6975a0 49.2%, #66739f 50.8%, #63729e 52.4%, #5e729e 54.0%, #59739d 55.6%, #53759d 57.1%, #4c769c 58.7%, #46789a 60.3%, #3f7a98 61.9%, #397c95 63.5%, #337e91 65.1%, #2f7f8d 66.7%, #2c8089 68.3%, #298086 69.8%, #278083 71.4%, #247e81 73.0%, #207c7f 74.6%, #1a797f 76.2%, #157580 77.8%, #127082 79.4%, #166a83 81.0%, #1e6383 82.5%, #285b83 84.1%, #325380 85.7%, #3a4a7c 87.3%, #414175 88.9%, #47396c 90.5%, #4b3162 92.1%, #4d2a57 93.7%, #4e244c 95.2%, #4f1f42 96.8%, #4e1b3a 98.4%, #4d1833 100.0%);
background: linear-gradient(135deg in oklch, oklch(34.25% 0.1268 258.05) 0.0%, oklch(35.85% 0.1235 256.44) 1.6%, oklch(37.96% 0.1191 254.23) 3.2%, oklch(40.49% 0.1140 251.52) 4.8%, oklch(43.37% 0.1081 248.42) 6.3%, oklch(46.51% 0.1017 245.03) 7.9%, oklch(49.84% 0.0948 241.46) 9.5%, oklch(53.29% 0.0878 237.79) 11.1%, oklch(56.76% 0.0807 234.15) 12.7%, oklch(60.18% 0.0736 230.63) 14.3%, oklch(63.47% 0.0668 227.33) 15.9%, oklch(66.56% 0.0604 224.36) 17.5%, oklch(69.36% 0.0545 221.82) 19.0%, oklch(71.80% 0.0493 219.81) 20.6%, oklch(73.80% 0.0450 218.44) 22.2%, oklch(75.27% 0.0417 217.81) 23.8%, oklch(76.15% 0.0395 218.04) 25.4%, oklch(76.46% 0.0384 219.37) 27.0%, oklch(76.29% 0.0382 221.76) 28.6%, oklch(75.70% 0.0387 225.04) 30.2%, oklch(74.74% 0.0398 229.04) 31.7%, oklch(73.48% 0.0416 233.59) 33.3%, oklch(71.97% 0.0438 238.51) 34.9%, oklch(70.27% 0.0464 243.64) 36.5%, oklch(68.45% 0.0492 248.82) 38.1%, oklch(66.56% 0.0522 253.86) 39.7%, oklch(64.66% 0.0553 258.61) 41.3%, oklch(62.81% 0.0584 262.89) 42.9%, oklch(61.07% 0.0613 266.53) 44.4%, oklch(59.50% 0.0639 269.36) 46.0%, oklch(58.15% 0.0663 271.21) 47.6%, oklch(57.09% 0.0681 271.91) 49.2%, oklch(56.36% 0.0696 271.25) 50.8%, oklch(55.85% 0.0708 268.86) 52.4%, oklch(55.50% 0.0720 264.94) 54.0%, oklch(55.29% 0.0732 259.76) 55.6%, oklch(55.20% 0.0742 253.60) 57.1%, oklch(55.20% 0.0752 246.73) 58.7%, oklch(55.25% 0.0761 239.41) 60.3%, oklch(55.33% 0.0770 231.92) 61.9%, oklch(55.42% 0.0778 224.52) 63.5%, oklch(55.48% 0.0786 217.50) 65.1%, oklch(55.48% 0.0794 211.12) 66.7%, oklch(55.41% 0.0801 205.65) 68.3%, oklch(55.23% 0.0807 201.36) 69.8%, oklch(54.91% 0.0813 198.53) 71.4%, oklch(54.42% 0.0820 197.42) 73.0%, oklch(53.75% 0.0825 198.30) 74.6%, oklch(52.85% 0.0831 201.45) 76.2%, oklch(51.72% 0.0836 206.81) 77.8%, oklch(50.39% 0.0840 214.10) 79.4%, oklch(48.90% 0.0844 223.03) 81.0%, oklch(47.28% 0.0848 233.31) 82.5%, oklch(45.56% 0.0851 244.65) 84.1%, oklch(43.77% 0.0853 256.76) 85.7%, oklch(41.96% 0.0856 269.33) 87.3%, oklch(40.15% 0.0858 282.10) 88.9%, oklch(38.37% 0.0860 294.75) 90.5%, oklch(36.66% 0.0861 307.01) 92.1%, oklch(35.06% 0.0863 318.57) 93.7%, oklch(33.58% 0.0864 329.15) 95.2%, oklch(32.28% 0.0866 338.46) 96.8%, oklch(31.18% 0.0867 346.21) 98.4%, oklch(30.31% 0.0868 352.10) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.343 | 0.127 | 258 |
| 2 | 0.76 | 0.04 | 217.9 |
| 3 | 0.567 | 0.069 | 271.8 |
| 4 | 0.535 | 0.083 | 198.9 |
| 5 | 0.303 | 0.087 | 352.1 |

## In these collections

- [Pink and teal gradients](https://grabient.com/pink-and-teal-gradients)

## Other forms

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