# Monochrome light blue to blue linear gradient

Monochrome light blue to blue linear gradient with 32 colors: #cbdffb, #c8defa, #c5ddfa, #c1dcf9, #bddaf8, #b8d8f7, #b3d7f5, #add5f4, #a7d2f2, #a1d0f1, #9bcdef, #96caee, #90c7ec, #8ac3eb, #84bfe9, #7fbbe8, #79b6e7, #74b2e5, #6fade4, #69a8e3, #64a3e2, #5e9ee1, #5898df, #5292de, #4b8cdd, #4585db, #407eda, #3b78d9, #3772d7, #346cd6, #3267d5, #3063d4. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kU5CC2aJo91eqwXDwsFg`
- Page: https://grabient.com/kU5CC2aJo91eqwXDwsFg?steps=32&angle=135
- Drawn as: linear gradient, 32 steps, 135 degrees
- Kinds: light to dark, pastel, cool, monochrome
- Hues: analogous
- Contrast of its darkest and lightest colors: 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 | `#cbdffb` | `oklch(89.76% 0.0441 255.94)` | Arc Light | black, 15.4 to 1 |
| 2 | `#c8defa` | `oklch(89.36% 0.0456 254.78)` | Arc Light | black, 15.3 to 1 |
| 3 | `#c5ddfa` | `oklch(88.88% 0.0474 253.13)` | Fly a Kite | black, 15 to 1 |
| 4 | `#c1dcf9` | `oklch(88.32% 0.0495 251.12)` | Oh Boy! | black, 14.8 to 1 |
| 5 | `#bddaf8` | `oklch(87.68% 0.0519 248.88)` | Oh Boy! | black, 14.5 to 1 |
| 6 | `#b8d8f7` | `oklch(86.98% 0.0546 246.55)` | Oh Boy! | black, 14.2 to 1 |
| 7 | `#b3d7f5` | `oklch(86.22% 0.0574 244.26)` | Blue Rice | black, 13.9 to 1 |
| 8 | `#add5f4` | `oklch(85.40% 0.0605 242.13)` | Blue Rice | black, 13.5 to 1 |
| 9 | `#a7d2f2` | `oklch(84.52% 0.0637 240.31)` | Marzena Dream | black, 13.1 to 1 |
| 10 | `#a1d0f1` | `oklch(83.59% 0.0670 238.92)` | Mediterranean Charm | black, 12.8 to 1 |
| 11 | `#9bcdef` | `oklch(82.62% 0.0705 238.10)` | Fail Whale | black, 12.4 to 1 |
| 12 | `#96caee` | `oklch(81.59% 0.0740 237.93)` | Honolulu | black, 12 to 1 |
| 13 | `#90c7ec` | `oklch(80.49% 0.0777 238.28)` | Shimmer | black, 11.5 to 1 |
| 14 | `#8ac3eb` | `oklch(79.31% 0.0816 239.07)` | Wasurenagusa Blue | black, 11.1 to 1 |
| 15 | `#84bfe9` | `oklch(78.07% 0.0856 240.21)` | Watery Sea | black, 10.6 to 1 |
| 16 | `#7fbbe8` | `oklch(76.77% 0.0898 241.62)` | Aero | black, 10.1 to 1 |
| 17 | `#79b6e7` | `oklch(75.43% 0.0942 243.21)` | Aero | black, 9.6 to 1 |
| 18 | `#74b2e5` | `oklch(74.06% 0.0987 244.91)` | Lucea | black, 9.2 to 1 |
| 19 | `#6fade4` | `oklch(72.67% 0.1035 246.62)` | Jordy Blue | black, 8.7 to 1 |
| 20 | `#69a8e3` | `oklch(71.26% 0.1084 248.27)` | Greek Sea | black, 8.2 to 1 |
| 21 | `#64a3e2` | `oklch(69.84% 0.1136 249.78)` | Windjammer | black, 7.8 to 1 |
| 22 | `#5e9ee1` | `oklch(68.42% 0.1190 251.07)` | Blue Bay | black, 7.4 to 1 |
| 23 | `#5898df` | `oklch(66.87% 0.1251 252.38)` | Little Boy Blue | black, 6.9 to 1 |
| 24 | `#5292de` | `oklch(65.19% 0.1320 253.77)` | United Nations Blue | black, 6.5 to 1 |
| 25 | `#4b8cdd` | `oklch(63.44% 0.1393 255.19)` | Oregon Blue | black, 6 to 1 |
| 26 | `#4585db` | `oklch(61.66% 0.1468 256.62)` | Blue Jay | black, 5.6 to 1 |
| 27 | `#407eda` | `oklch(59.90% 0.1543 258.02)` | Soothing Sapphire | black, 5.2 to 1 |
| 28 | `#3b78d9` | `oklch(58.21% 0.1615 259.35)` | Skies of Cyberspace | black, 4.8 to 1 |
| 29 | `#3772d7` | `oklch(56.64% 0.1683 260.58)` | Enchanting Sapphire | white, 4.6 to 1 |
| 30 | `#346cd6` | `oklch(55.24% 0.1743 261.68)` | Enchanting Sapphire | white, 4.9 to 1 |
| 31 | `#3267d5` | `oklch(54.06% 0.1794 262.61)` | Flickr Blue | white, 5.2 to 1 |
| 32 | `#3063d4` | `oklch(53.15% 0.1833 263.33)` | Janitor | white, 5.4 to 1 |

## CSS

```css
background: linear-gradient(135deg, #cbdffb 0.0%, #c8defa 3.2%, #c5ddfa 6.5%, #c1dcf9 9.7%, #bddaf8 12.9%, #b8d8f7 16.1%, #b3d7f5 19.4%, #add5f4 22.6%, #a7d2f2 25.8%, #a1d0f1 29.0%, #9bcdef 32.3%, #96caee 35.5%, #90c7ec 38.7%, #8ac3eb 41.9%, #84bfe9 45.2%, #7fbbe8 48.4%, #79b6e7 51.6%, #74b2e5 54.8%, #6fade4 58.1%, #69a8e3 61.3%, #64a3e2 64.5%, #5e9ee1 67.7%, #5898df 71.0%, #5292de 74.2%, #4b8cdd 77.4%, #4585db 80.6%, #407eda 83.9%, #3b78d9 87.1%, #3772d7 90.3%, #346cd6 93.5%, #3267d5 96.8%, #3063d4 100.0%);
background: linear-gradient(135deg in oklch, oklch(89.76% 0.0441 255.94) 0.0%, oklch(89.36% 0.0456 254.78) 3.2%, oklch(88.88% 0.0474 253.13) 6.5%, oklch(88.32% 0.0495 251.12) 9.7%, oklch(87.68% 0.0519 248.88) 12.9%, oklch(86.98% 0.0546 246.55) 16.1%, oklch(86.22% 0.0574 244.26) 19.4%, oklch(85.40% 0.0605 242.13) 22.6%, oklch(84.52% 0.0637 240.31) 25.8%, oklch(83.59% 0.0670 238.92) 29.0%, oklch(82.62% 0.0705 238.10) 32.3%, oklch(81.59% 0.0740 237.93) 35.5%, oklch(80.49% 0.0777 238.28) 38.7%, oklch(79.31% 0.0816 239.07) 41.9%, oklch(78.07% 0.0856 240.21) 45.2%, oklch(76.77% 0.0898 241.62) 48.4%, oklch(75.43% 0.0942 243.21) 51.6%, oklch(74.06% 0.0987 244.91) 54.8%, oklch(72.67% 0.1035 246.62) 58.1%, oklch(71.26% 0.1084 248.27) 61.3%, oklch(69.84% 0.1136 249.78) 64.5%, oklch(68.42% 0.1190 251.07) 67.7%, oklch(66.87% 0.1251 252.38) 71.0%, oklch(65.19% 0.1320 253.77) 74.2%, oklch(63.44% 0.1393 255.19) 77.4%, oklch(61.66% 0.1468 256.62) 80.6%, oklch(59.90% 0.1543 258.02) 83.9%, oklch(58.21% 0.1615 259.35) 87.1%, oklch(56.64% 0.1683 260.58) 90.3%, oklch(55.24% 0.1743 261.68) 93.5%, oklch(54.06% 0.1794 262.61) 96.8%, oklch(53.15% 0.1833 263.33) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.898 | 0.044 | 255.9 |
| 2 | 0.823 | 0.072 | 238 |
| 3 | 0.689 | 0.117 | 250.7 |
| 4 | 0.531 | 0.183 | 263.3 |

## In these collections

- [Monochrome blue gradients](https://grabient.com/monochrome-blue-gradients)
- [Ice gradients](https://grabient.com/ice-gradients)

## Other forms

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