# Navy mint diagonal beam

Analogous blue, light blue and teal linear gradient with 48 colors: #16597b, #1c6181, #256c89, #2f7994, #3c889f, #4a98ab, #59a9b7, #69b9c3, #77c8ce, #84d5d7, #8fdfdf, #95e6e4, #97e8e6, #94e5e6, #8ddee3, #83d4de, #78c8d8, #6cb9d0, #61aac6, #579abc, #4f8bb1, #487da7, #43729d, #3e6995, #3b6490, #37608a, #345e86, #305d81, #2e5c7d, #2c5d79, #2c5e76, #2c5f74, #2e6172, #2f6370, #316570, #336770, #336a72, #346e75, #347479, #347a7e, #338083, #338889, #318f8f, #309694, #2e9c99, #2ca29e, #2aa7a1, #29aba4. Edit it and copy or download CSS, SVG, PNG or shader code.

- Also called: Analogous blue, light blue and teal linear gradient
- Seed: `kWcD2n75y7D-fRq9lTr1ac9g`
- Page: https://grabient.com/kWcD2n75y7D-fRq9lTr1ac9g?steps=48&angle=225
- Drawn as: linear gradient, 48 steps, 225 degrees
- Kinds: cool
- Hues: analogous
- Contrast of its darkest and lightest colors: 5.4 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 | `#16597b` | `oklch(44.09% 0.0841 235.55)` | Commandes | white, 7.6 to 1 |
| 2 | `#1c6181` | `oklch(46.53% 0.0837 233.18)` | Blue Sapphire | white, 6.8 to 1 |
| 3 | `#256c89` | `oklch(49.95% 0.0833 229.77)` | Saxony Blue | white, 5.8 to 1 |
| 4 | `#2f7994` | `oklch(54.14% 0.0827 225.56)` | Turkish Stone | white, 4.9 to 1 |
| 5 | `#3c889f` | `oklch(58.85% 0.0821 220.81)` | Turquesa | black, 5.2 to 1 |
| 6 | `#4a98ab` | `oklch(63.86% 0.0815 215.79)` | Alpine Lake | black, 6.3 to 1 |
| 7 | `#59a9b7` | `oklch(68.94% 0.0808 210.75)` | Verditer Blue | black, 7.7 to 1 |
| 8 | `#69b9c3` | `oklch(73.85% 0.0802 205.95)` | Azul Turquesa | black, 9.3 to 1 |
| 9 | `#77c8ce` | `oklch(78.36% 0.0796 201.65)` | Valonia | black, 10.9 to 1 |
| 10 | `#84d5d7` | `oklch(82.25% 0.0791 198.10)` | Mountain Lake Blue | black, 12.4 to 1 |
| 11 | `#8fdfdf` | `oklch(85.27% 0.0787 195.56)` | Paradisiacal Getaway | black, 13.8 to 1 |
| 12 | `#95e6e4` | `oklch(87.20% 0.0786 194.29)` | Aqua Fiesta | black, 14.6 to 1 |
| 13 | `#97e8e6` | `oklch(87.81% 0.0786 194.57)` | Everest | black, 14.9 to 1 |
| 14 | `#94e5e6` | `oklch(87.05% 0.0789 196.73)` | Aqua Fiesta | black, 14.6 to 1 |
| 15 | `#8ddee3` | `oklch(85.12% 0.0796 200.58)` | Paradisiacal Getaway | black, 13.7 to 1 |
| 16 | `#83d4de` | `oklch(82.24% 0.0805 205.75)` | VIC 20 Sky | black, 12.4 to 1 |
| 17 | `#78c8d8` | `oklch(78.62% 0.0816 211.88)` | Betsy | black, 11 to 1 |
| 18 | `#6cb9d0` | `oklch(74.48% 0.0827 218.60)` | Blue Brocade | black, 9.4 to 1 |
| 19 | `#61aac6` | `oklch(70.04% 0.0838 225.54)` | Blue Mist | black, 8 to 1 |
| 20 | `#579abc` | `oklch(65.52% 0.0847 232.34)` | Steel Light Blue | black, 6.7 to 1 |
| 21 | `#4f8bb1` | `oklch(61.14% 0.0855 238.63)` | Cosmopolitan | black, 5.6 to 1 |
| 22 | `#487da7` | `oklch(57.11% 0.0860 244.05)` | Aleutian Isle | black, 4.7 to 1 |
| 23 | `#43729d` | `oklch(53.64% 0.0861 248.24)` | Naval | white, 5.1 to 1 |
| 24 | `#3e6995` | `oklch(50.97% 0.0858 250.82)` | Queen Blue | white, 5.7 to 1 |
| 25 | `#3b6490` | `oklch(49.21% 0.0849 251.52)` | Blue Ribbon Beauty | white, 6.1 to 1 |
| 26 | `#37608a` | `oklch(47.89% 0.0830 250.67)` | Luxurious Blue | white, 6.5 to 1 |
| 27 | `#345e86` | `oklch(46.91% 0.0805 248.56)` | Pelagic | white, 6.8 to 1 |
| 28 | `#305d81` | `oklch(46.23% 0.0773 245.41)` | Pelagic | white, 7 to 1 |
| 29 | `#2e5c7d` | `oklch(45.83% 0.0739 241.45)` | Dark Blue | white, 7.1 to 1 |
| 30 | `#2c5d79` | `oklch(45.67% 0.0703 236.90)` | Nautical Creatures | white, 7.1 to 1 |
| 31 | `#2c5e76` | `oklch(45.73% 0.0668 231.98)` | Blumine | white, 7 to 1 |
| 32 | `#2c5f74` | `oklch(45.97% 0.0636 226.93)` | Blumine | white, 7 to 1 |
| 33 | `#2e6172` | `oklch(46.38% 0.0609 221.96)` | Atlantis | white, 6.8 to 1 |
| 34 | `#2f6370` | `oklch(46.91% 0.0588 217.31)` | Pedigree | white, 6.7 to 1 |
| 35 | `#316570` | `oklch(47.54% 0.0577 213.18)` | Pedigree | white, 6.5 to 1 |
| 36 | `#336770` | `oklch(48.24% 0.0577 209.82)` | Mordant Blue | white, 6.3 to 1 |
| 37 | `#336a72` | `oklch(49.09% 0.0590 207.19)` | Aquarium | white, 6 to 1 |
| 38 | `#346e75` | `oklch(50.31% 0.0616 204.75)` | Lakelike | white, 5.7 to 1 |
| 39 | `#347479` | `oklch(51.84% 0.0652 202.48)` | King Tide | white, 5.3 to 1 |
| 40 | `#347a7e` | `oklch(53.60% 0.0697 200.38)` | Diver’s Eden | white, 4.9 to 1 |
| 41 | `#338083` | `oklch(55.52% 0.0748 198.44)` | Green Blue Slate | white, 4.5 to 1 |
| 42 | `#338889` | `oklch(57.52% 0.0803 196.66)` | Turkish Jade | black, 4.9 to 1 |
| 43 | `#318f8f` | `oklch(59.54% 0.0858 195.03)` | Fish Story | black, 5.4 to 1 |
| 44 | `#309694` | `oklch(61.51% 0.0913 193.55)` | Java | black, 5.9 to 1 |
| 45 | `#2e9c99` | `oklch(63.34% 0.0965 192.22)` | Latigo Bay | black, 6.3 to 1 |
| 46 | `#2ca29e` | `oklch(64.97% 0.1010 191.02)` | Sea Kale | black, 6.7 to 1 |
| 47 | `#2aa7a1` | `oklch(66.32% 0.1048 189.97)` | Royal Cloak | black, 7.1 to 1 |
| 48 | `#29aba4` | `oklch(67.32% 0.1075 189.05)` | Teal Me No Lies | black, 7.4 to 1 |

## CSS

```css
background: linear-gradient(225deg, #16597b 0.0%, #1c6181 2.1%, #256c89 4.3%, #2f7994 6.4%, #3c889f 8.5%, #4a98ab 10.6%, #59a9b7 12.8%, #69b9c3 14.9%, #77c8ce 17.0%, #84d5d7 19.1%, #8fdfdf 21.3%, #95e6e4 23.4%, #97e8e6 25.5%, #94e5e6 27.7%, #8ddee3 29.8%, #83d4de 31.9%, #78c8d8 34.0%, #6cb9d0 36.2%, #61aac6 38.3%, #579abc 40.4%, #4f8bb1 42.6%, #487da7 44.7%, #43729d 46.8%, #3e6995 48.9%, #3b6490 51.1%, #37608a 53.2%, #345e86 55.3%, #305d81 57.4%, #2e5c7d 59.6%, #2c5d79 61.7%, #2c5e76 63.8%, #2c5f74 66.0%, #2e6172 68.1%, #2f6370 70.2%, #316570 72.3%, #336770 74.5%, #336a72 76.6%, #346e75 78.7%, #347479 80.9%, #347a7e 83.0%, #338083 85.1%, #338889 87.2%, #318f8f 89.4%, #309694 91.5%, #2e9c99 93.6%, #2ca29e 95.7%, #2aa7a1 97.9%, #29aba4 100.0%);
background: linear-gradient(225deg in oklch, oklch(44.09% 0.0841 235.55) 0.0%, oklch(46.53% 0.0837 233.18) 2.1%, oklch(49.95% 0.0833 229.77) 4.3%, oklch(54.14% 0.0827 225.56) 6.4%, oklch(58.85% 0.0821 220.81) 8.5%, oklch(63.86% 0.0815 215.79) 10.6%, oklch(68.94% 0.0808 210.75) 12.8%, oklch(73.85% 0.0802 205.95) 14.9%, oklch(78.36% 0.0796 201.65) 17.0%, oklch(82.25% 0.0791 198.10) 19.1%, oklch(85.27% 0.0787 195.56) 21.3%, oklch(87.20% 0.0786 194.29) 23.4%, oklch(87.81% 0.0786 194.57) 25.5%, oklch(87.05% 0.0789 196.73) 27.7%, oklch(85.12% 0.0796 200.58) 29.8%, oklch(82.24% 0.0805 205.75) 31.9%, oklch(78.62% 0.0816 211.88) 34.0%, oklch(74.48% 0.0827 218.60) 36.2%, oklch(70.04% 0.0838 225.54) 38.3%, oklch(65.52% 0.0847 232.34) 40.4%, oklch(61.14% 0.0855 238.63) 42.6%, oklch(57.11% 0.0860 244.05) 44.7%, oklch(53.64% 0.0861 248.24) 46.8%, oklch(50.97% 0.0858 250.82) 48.9%, oklch(49.21% 0.0849 251.52) 51.1%, oklch(47.89% 0.0830 250.67) 53.2%, oklch(46.91% 0.0805 248.56) 55.3%, oklch(46.23% 0.0773 245.41) 57.4%, oklch(45.83% 0.0739 241.45) 59.6%, oklch(45.67% 0.0703 236.90) 61.7%, oklch(45.73% 0.0668 231.98) 63.8%, oklch(45.97% 0.0636 226.93) 66.0%, oklch(46.38% 0.0609 221.96) 68.1%, oklch(46.91% 0.0588 217.31) 70.2%, oklch(47.54% 0.0577 213.18) 72.3%, oklch(48.24% 0.0577 209.82) 74.5%, oklch(49.09% 0.0590 207.19) 76.6%, oklch(50.31% 0.0616 204.75) 78.7%, oklch(51.84% 0.0652 202.48) 80.9%, oklch(53.60% 0.0697 200.38) 83.0%, oklch(55.52% 0.0748 198.44) 85.1%, oklch(57.52% 0.0803 196.66) 87.2%, oklch(59.54% 0.0858 195.03) 89.4%, oklch(61.51% 0.0913 193.55) 91.5%, oklch(63.34% 0.0965 192.22) 93.6%, oklch(64.97% 0.1010 191.02) 95.7%, oklch(66.32% 0.1048 189.97) 97.9%, oklch(67.32% 0.1075 189.05) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.441 | 0.084 | 235.5 |
| 2 | 0.878 | 0.079 | 194.3 |
| 3 | 0.5 | 0.085 | 251.4 |
| 4 | 0.484 | 0.058 | 209.1 |
| 5 | 0.673 | 0.107 | 189 |

## In these collections

- [Turquoise](https://grabient.com/turquoise)
- [Between tides](https://grabient.com/between-tides)

## Other forms

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