# Monochrome light blue to blue linear gradient

Monochrome light blue to blue linear gradient with 32 colors: #d4eff1, #d0ecef, #cce9ed, #c7e5ea, #c1e0e6, #bbdbe3, #b5d6df, #afd1db, #a8cbd8, #a2c6d4, #9cc1d0, #97bccd, #91b7ca, #8bb2c6, #85adc3, #80a8bf, #7aa3bc, #749eb8, #6e99b5, #6994b1, #638eae, #5d89aa, #5884a7, #517fa3, #4b799f, #45739b, #3f6e97, #396894, #346390, #2f5f8d, #2b5b8b, #285889. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kU7RWQ45DCs6ZQa5osEA`
- Page: https://grabient.com/kU7RWQ45DCs6ZQa5osEA?steps=32
- Drawn as: linear gradient, 32 steps, 90 degrees
- Kinds: light to dark, muted, cool, monochrome
- Hues: analogous
- Contrast of its darkest and lightest colors: 6 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 | `#d4eff1` | `oklch(93.31% 0.0289 203.20)` | Lakeside Mist | black, 17.4 to 1 |
| 2 | `#d0ecef` | `oklch(92.46% 0.0299 204.57)` | Sprinkled With Dew | black, 16.9 to 1 |
| 3 | `#cce9ed` | `oklch(91.38% 0.0310 206.37)` | Summer Mist | black, 16.4 to 1 |
| 4 | `#c7e5ea` | `oklch(90.10% 0.0323 208.51)` | Igloo Blue | black, 15.7 to 1 |
| 5 | `#c1e0e6` | `oklch(88.68% 0.0338 210.90)` | H₂O | black, 15.1 to 1 |
| 6 | `#bbdbe3` | `oklch(87.13% 0.0355 213.46)` | Quick-Freeze | black, 14.3 to 1 |
| 7 | `#b5d6df` | `oklch(85.50% 0.0372 216.11)` | Rain Check | black, 13.6 to 1 |
| 8 | `#afd1db` | `oklch(83.82% 0.0390 218.76)` | Balboa | black, 12.9 to 1 |
| 9 | `#a8cbd8` | `oklch(82.13% 0.0409 221.32)` | Alpine Morning Blue | black, 12.2 to 1 |
| 10 | `#a2c6d4` | `oklch(80.46% 0.0429 223.70)` | Blue Dam | black, 11.5 to 1 |
| 11 | `#9cc1d0` | `oklch(78.86% 0.0448 225.82)` | Gift of the Sea | black, 10.9 to 1 |
| 12 | `#97bccd` | `oklch(77.32% 0.0468 227.66)` | Reef Blue | black, 10.3 to 1 |
| 13 | `#91b7ca` | `oklch(75.77% 0.0488 229.38)` | Moon Jellyfish | black, 9.8 to 1 |
| 14 | `#8bb2c6` | `oklch(74.19% 0.0510 231.00)` | Bermuda Blue | black, 9.2 to 1 |
| 15 | `#85adc3` | `oklch(72.60% 0.0532 232.54)` | Arabella | black, 8.7 to 1 |
| 16 | `#80a8bf` | `oklch(70.99% 0.0554 234.00)` | Stormfang | black, 8.2 to 1 |
| 17 | `#7aa3bc` | `oklch(69.37% 0.0577 235.40)` | Ocean Surf | black, 7.7 to 1 |
| 18 | `#749eb8` | `oklch(67.74% 0.0601 236.73)` | Crisp French Blue | black, 7.3 to 1 |
| 19 | `#6e99b5` | `oklch(66.12% 0.0625 238.01)` | Splendid Blue | black, 6.8 to 1 |
| 20 | `#6994b1` | `oklch(64.50% 0.0649 239.25)` | Aragonite Blue | black, 6.4 to 1 |
| 21 | `#638eae` | `oklch(62.88% 0.0673 240.46)` | Alpha Tango | black, 6 to 1 |
| 22 | `#5d89aa` | `oklch(61.27% 0.0697 241.64)` | Rackley | black, 5.6 to 1 |
| 23 | `#5884a7` | `oklch(59.56% 0.0723 242.80)` | Peyton | black, 5.2 to 1 |
| 24 | `#517fa3` | `oklch(57.75% 0.0751 243.94)` | Borage | black, 4.8 to 1 |
| 25 | `#4b799f` | `oklch(55.89% 0.0781 245.04)` | Zenith | white, 4.6 to 1 |
| 26 | `#45739b` | `oklch(54.03% 0.0810 246.09)` | Dull Blue | white, 5 to 1 |
| 27 | `#3f6e97` | `oklch(52.21% 0.0839 247.09)` | National Anthem | white, 5.4 to 1 |
| 28 | `#396894` | `oklch(50.47% 0.0867 248.01)` | Too Blue | white, 5.8 to 1 |
| 29 | `#346390` | `oklch(48.87% 0.0893 248.85)` | Teeny Bikini | white, 6.2 to 1 |
| 30 | `#2f5f8d` | `oklch(47.44% 0.0916 249.59)` | Make-Up Blue | white, 6.6 to 1 |
| 31 | `#2b5b8b` | `oklch(46.22% 0.0936 250.23)` | Dead Lake | white, 7 to 1 |
| 32 | `#285889` | `oklch(45.28% 0.0951 250.76)` | Endeavour | white, 7.3 to 1 |

## CSS

```css
background: linear-gradient(90deg, #d4eff1 0.0%, #d0ecef 3.2%, #cce9ed 6.5%, #c7e5ea 9.7%, #c1e0e6 12.9%, #bbdbe3 16.1%, #b5d6df 19.4%, #afd1db 22.6%, #a8cbd8 25.8%, #a2c6d4 29.0%, #9cc1d0 32.3%, #97bccd 35.5%, #91b7ca 38.7%, #8bb2c6 41.9%, #85adc3 45.2%, #80a8bf 48.4%, #7aa3bc 51.6%, #749eb8 54.8%, #6e99b5 58.1%, #6994b1 61.3%, #638eae 64.5%, #5d89aa 67.7%, #5884a7 71.0%, #517fa3 74.2%, #4b799f 77.4%, #45739b 80.6%, #3f6e97 83.9%, #396894 87.1%, #346390 90.3%, #2f5f8d 93.5%, #2b5b8b 96.8%, #285889 100.0%);
background: linear-gradient(90deg in oklch, oklch(93.31% 0.0289 203.20) 0.0%, oklch(92.46% 0.0299 204.57) 3.2%, oklch(91.38% 0.0310 206.37) 6.5%, oklch(90.10% 0.0323 208.51) 9.7%, oklch(88.68% 0.0338 210.90) 12.9%, oklch(87.13% 0.0355 213.46) 16.1%, oklch(85.50% 0.0372 216.11) 19.4%, oklch(83.82% 0.0390 218.76) 22.6%, oklch(82.13% 0.0409 221.32) 25.8%, oklch(80.46% 0.0429 223.70) 29.0%, oklch(78.86% 0.0448 225.82) 32.3%, oklch(77.32% 0.0468 227.66) 35.5%, oklch(75.77% 0.0488 229.38) 38.7%, oklch(74.19% 0.0510 231.00) 41.9%, oklch(72.60% 0.0532 232.54) 45.2%, oklch(70.99% 0.0554 234.00) 48.4%, oklch(69.37% 0.0577 235.40) 51.6%, oklch(67.74% 0.0601 236.73) 54.8%, oklch(66.12% 0.0625 238.01) 58.1%, oklch(64.50% 0.0649 239.25) 61.3%, oklch(62.88% 0.0673 240.46) 64.5%, oklch(61.27% 0.0697 241.64) 67.7%, oklch(59.56% 0.0723 242.80) 71.0%, oklch(57.75% 0.0751 243.94) 74.2%, oklch(55.89% 0.0781 245.04) 77.4%, oklch(54.03% 0.0810 246.09) 80.6%, oklch(52.21% 0.0839 247.09) 83.9%, oklch(50.47% 0.0867 248.01) 87.1%, oklch(48.87% 0.0893 248.85) 90.3%, oklch(47.44% 0.0916 249.59) 93.5%, oklch(46.22% 0.0936 250.23) 96.8%, oklch(45.28% 0.0951 250.76) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.933 | 0.029 | 203.2 |
| 2 | 0.783 | 0.045 | 226.5 |
| 3 | 0.618 | 0.069 | 241.2 |
| 4 | 0.453 | 0.095 | 250.8 |

## In these collections

- [Weather map gradients](https://grabient.com/weather-map-gradients)

## Other forms

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