# Blue and turquoise glass palette

The Blue and turquoise glass palette brings together dark blue, blue, and pale teal. The colors span a broad lightness range, combining moderate color with clear contrast. Its balanced and composed character suits brand mood boards and editorial graphics. Its darkest tone is dark blue, and its lightest tone is pale teal.

- Also called: Cool navy, blue and light blue angular gradient
- Seed: `kcPSW7q6C_Lmqv1Grr8U6u-3KSvXIpUNp5jBw`
- Page: https://grabient.com/kcPSW7q6C_Lmqv1Grr8U6u-3KSvXIpUNp5jBw?style=angularGradient&steps=32&angle=315
- Drawn as: angular gradient, 32 steps, 315 degrees
- Kinds: light center, vivid, cool, monochrome
- Hues: analogous
- Contrast of its darkest and lightest colors: 12.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 | `#121e37` | `oklch(24.02% 0.0510 263.67)` | Sombre Night | white, 16.5 to 1 |
| 2 | `#14223f` | `oklch(25.62% 0.0573 262.65)` | Cool Balaclavas Are Forever | white, 15.7 to 1 |
| 3 | `#152849` | `oklch(27.90% 0.0664 261.18)` | Rurikon Blue | white, 14.7 to 1 |
| 4 | `#162e55` | `oklch(30.53% 0.0766 259.52)` | Elite Blue | white, 13.4 to 1 |
| 5 | `#173561` | `oklch(33.19% 0.0861 257.93)` | Navy Trim | white, 12.2 to 1 |
| 6 | `#173c6c` | `oklch(35.64% 0.0938 256.61)` | Ashenvale Nights | white, 11 to 1 |
| 7 | `#184377` | `oklch(38.14% 0.1008 255.46)` | Inoffensive Blue | white, 10 to 1 |
| 8 | `#194a82` | `oklch(40.67% 0.1073 254.36)` | Dance Studio | white, 8.9 to 1 |
| 9 | `#1a518c` | `oklch(43.18% 0.1130 253.19)` | Nautical Blue | white, 8 to 1 |
| 10 | `#1a5896` | `oklch(45.62% 0.1177 251.84)` | Suddenly Sapphire | white, 7.2 to 1 |
| 11 | `#1a609f` | `oklch(47.97% 0.1216 250.34)` | Drakenhof Nightshade | white, 6.5 to 1 |
| 12 | `#1967a7` | `oklch(50.28% 0.1247 248.73)` | Medium Persian Blue | white, 5.9 to 1 |
| 13 | `#1a6faf` | `oklch(52.56% 0.1269 247.02)` | Planetarium | white, 5.3 to 1 |
| 14 | `#1b77b6` | `oklch(54.85% 0.1280 245.19)` | Americana | white, 4.8 to 1 |
| 15 | `#1c7ebd` | `oklch(57.01% 0.1286 243.36)` | Honolulu Blue | black, 4.7 to 1 |
| 16 | `#1d84c2` | `oklch(58.82% 0.1291 241.66)` | Water Raceway | black, 5.1 to 1 |
| 17 | `#208bc7` | `oklch(60.76% 0.1284 239.76)` | Newport Blue | black, 5.5 to 1 |
| 18 | `#2a94cc` | `oklch(63.29% 0.1249 237.36)` | Splish Splash | black, 6.1 to 1 |
| 19 | `#3ca0d2` | `oklch(67.03% 0.1169 234.01)` | Peaceful River | black, 7.1 to 1 |
| 20 | `#5db6db` | `oklch(73.52% 0.1007 228.34)` | Aquella | black, 9.1 to 1 |
| 21 | `#85cee7` | `oklch(81.19% 0.0803 221.66)` | Sky of Ocean | black, 11.9 to 1 |
| 22 | `#a8e1f0` | `oklch(87.59% 0.0617 216.14)` | Atmospheric Soft Blue | black, 14.7 to 1 |
| 23 | `#b9e8f4` | `oklch(90.23% 0.0514 213.93)` | First of July | black, 15.9 to 1 |
| 24 | `#addfed` | `oklch(87.27% 0.0546 216.75)` | Quiet Nook | black, 14.5 to 1 |
| 25 | `#8dc8de` | `oklch(79.99% 0.0683 223.53)` | Gossamer Threads | black, 11.4 to 1 |
| 26 | `#66aacd` | `oklch(70.63% 0.0853 232.05)` | Salem Blue | black, 8.1 to 1 |
| 27 | `#478cba` | `oklch(61.42% 0.0987 240.08)` | Blueberry Festival | black, 5.7 to 1 |
| 28 | `#3674a7` | `oklch(54.18% 0.1019 245.74)` | Flat Blue | white, 4.9 to 1 |
| 29 | `#2d5e8f` | `oklch(47.26% 0.0960 250.28)` | Make-Up Blue | white, 6.7 to 1 |
| 30 | `#264b77` | `oklch(40.68% 0.0855 254.13)` | Sapphire Earrings | white, 8.9 to 1 |
| 31 | `#203b61` | `oklch(35.07% 0.0747 257.21)` | Navy Peony | white, 11.3 to 1 |
| 32 | `#1b3052` | `oklch(31.10% 0.0675 259.44)` | Elite Blue | white, 13.1 to 1 |

## CSS

```css
background: conic-gradient(from 315deg, #121e37 0.0%, #14223f 3.2%, #152849 6.5%, #162e55 9.7%, #173561 12.9%, #173c6c 16.1%, #184377 19.4%, #194a82 22.6%, #1a518c 25.8%, #1a5896 29.0%, #1a609f 32.3%, #1967a7 35.5%, #1a6faf 38.7%, #1b77b6 41.9%, #1c7ebd 45.2%, #1d84c2 48.4%, #208bc7 51.6%, #2a94cc 54.8%, #3ca0d2 58.1%, #5db6db 61.3%, #85cee7 64.5%, #a8e1f0 67.7%, #b9e8f4 71.0%, #addfed 74.2%, #8dc8de 77.4%, #66aacd 80.6%, #478cba 83.9%, #3674a7 87.1%, #2d5e8f 90.3%, #264b77 93.5%, #203b61 96.8%, #1b3052 100.0%);
background: conic-gradient(from 315deg in oklch, oklch(24.02% 0.0510 263.67) 0.0%, oklch(25.62% 0.0573 262.65) 3.2%, oklch(27.90% 0.0664 261.18) 6.5%, oklch(30.53% 0.0766 259.52) 9.7%, oklch(33.19% 0.0861 257.93) 12.9%, oklch(35.64% 0.0938 256.61) 16.1%, oklch(38.14% 0.1008 255.46) 19.4%, oklch(40.67% 0.1073 254.36) 22.6%, oklch(43.18% 0.1130 253.19) 25.8%, oklch(45.62% 0.1177 251.84) 29.0%, oklch(47.97% 0.1216 250.34) 32.3%, oklch(50.28% 0.1247 248.73) 35.5%, oklch(52.56% 0.1269 247.02) 38.7%, oklch(54.85% 0.1280 245.19) 41.9%, oklch(57.01% 0.1286 243.36) 45.2%, oklch(58.82% 0.1291 241.66) 48.4%, oklch(60.76% 0.1284 239.76) 51.6%, oklch(63.29% 0.1249 237.36) 54.8%, oklch(67.03% 0.1169 234.01) 58.1%, oklch(73.52% 0.1007 228.34) 61.3%, oklch(81.19% 0.0803 221.66) 64.5%, oklch(87.59% 0.0617 216.14) 67.7%, oklch(90.23% 0.0514 213.93) 71.0%, oklch(87.27% 0.0546 216.75) 74.2%, oklch(79.99% 0.0683 223.53) 77.4%, oklch(70.63% 0.0853 232.05) 80.6%, oklch(61.42% 0.0987 240.08) 83.9%, oklch(54.18% 0.1019 245.74) 87.1%, oklch(47.26% 0.0960 250.28) 90.3%, oklch(40.68% 0.0855 254.13) 93.5%, oklch(35.07% 0.0747 257.21) 96.8%, oklch(31.10% 0.0675 259.44) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.24 | 0.051 | 263.7 |
| 2 | 0.343 | 0.09 | 257.3 |
| 3 | 0.453 | 0.117 | 252 |
| 4 | 0.555 | 0.128 | 244.7 |
| 5 | 0.657 | 0.12 | 235.1 |
| 6 | 0.902 | 0.051 | 214 |
| 7 | 0.571 | 0.102 | 243.6 |
| 8 | 0.311 | 0.068 | 259.4 |

## In these collections

- [Glass gradients](https://grabient.com/glass-gradients)

## Other forms

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