# Ice Blue Diagonal Light

Blue, white, light blue and gray linear gradient with 48 colors: #237e9e, #2e81a1, #3986a5, #468caa, #5392b0, #6099b5, #6da0bc, #7ba8c2, #88b0c8, #95b8ce, #a2c0d4, #aec7da, #b9cfdf, #c3d6e4, #ccdce8, #d4e1eb, #dae6ee, #e0eaf1, #e5eef4, #eaf2f7, #eef6fa, #f2f9fd, #f6fcff, #fbfeff, #ffffff, #ffffff, #ffffff, #ffffff, #ffffff, #fbffff, #f2fdfe, #edf9fa, #e6f4f5, #dcecee, #d0e3e5, #c3d8db, #b4ccd0, #a4bfc5, #94b2b9, #84a4ae, #7496a2, #648998, #567c8d, #497084, #3d657b, #335c74, #2a546d, #244e68. Edit it and copy or download CSS, SVG, PNG or shader code.

- Also called: Blue, white, light blue and gray linear gradient
- Seed: `kUjUWhdAbBnsFO2zl8RA`
- Page: https://grabient.com/kUjUWhdAbBnsFO2zl8RA?steps=48&angle=45
- Drawn as: linear gradient, 48 steps, 45 degrees
- Kinds: light center, pastel, light, cool, monochrome
- Hues: analogous
- Contrast of its darkest and lightest colors: 8.9 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 | `#237e9e` | `oklch(55.51% 0.0951 226.41)` | Summer Blue | white, 4.6 to 1 |
| 2 | `#2e81a1` | `oklch(56.85% 0.0922 227.00)` | Greenland Blue | black, 4.7 to 1 |
| 3 | `#3986a5` | `oklch(58.56% 0.0885 227.86)` | Underwater Moonlight | black, 5.1 to 1 |
| 4 | `#468caa` | `oklch(60.58% 0.0840 228.94)` | Blue Chaise | black, 5.5 to 1 |
| 5 | `#5392b0` | `oklch(62.86% 0.0791 230.20)` | Jet Ski | black, 6 to 1 |
| 6 | `#6099b5` | `oklch(65.35% 0.0736 231.57)` | Shakespeare | black, 6.6 to 1 |
| 7 | `#6da0bc` | `oklch(67.99% 0.0678 233.01)` | Adventure Isle | black, 7.3 to 1 |
| 8 | `#7ba8c2` | `oklch(70.74% 0.0618 234.46)` | Serene Sea | black, 8.1 to 1 |
| 9 | `#88b0c8` | `oklch(73.55% 0.0557 235.88)` | Batch Blue | black, 9 to 1 |
| 10 | `#95b8ce` | `oklch(76.36% 0.0496 237.22)` | Sea Mark | black, 9.9 to 1 |
| 11 | `#a2c0d4` | `oklch(79.12% 0.0437 238.42)` | Angel Falls | black, 10.9 to 1 |
| 12 | `#aec7da` | `oklch(81.78% 0.0379 239.43)` | Caspian Tide | black, 12 to 1 |
| 13 | `#b9cfdf` | `oklch(84.28% 0.0326 240.20)` | Impressionist Sky | black, 13 to 1 |
| 14 | `#c3d6e4` | `oklch(86.59% 0.0277 240.67)` | Light Ridge Light | black, 14 to 1 |
| 15 | `#ccdce8` | `oklch(88.63% 0.0234 240.81)` | Blue Me Away | black, 14.9 to 1 |
| 16 | `#d4e1eb` | `oklch(90.37% 0.0198 240.56)` | Pale Grey Blue | black, 15.8 to 1 |
| 17 | `#dae6ee` | `oklch(91.78% 0.0171 239.85)` | First Light | black, 16.5 to 1 |
| 18 | `#e0eaf1` | `oklch(93.09% 0.0148 238.50)` | Himalaya Peaks | black, 17.1 to 1 |
| 19 | `#e5eef4` | `oklch(94.38% 0.0128 236.56)` | Morning Mist | black, 17.8 to 1 |
| 20 | `#eaf2f7` | `oklch(95.61% 0.0112 234.13)` | Powder White | black, 18.5 to 1 |
| 21 | `#eef6fa` | `oklch(96.77% 0.0100 231.29)` | Silent Snowfall | black, 19.1 to 1 |
| 22 | `#f2f9fd` | `oklch(97.82% 0.0090 228.16)` | Distant Horizon | black, 19.7 to 1 |
| 23 | `#f6fcff` | `oklch(98.75% 0.0080 224.73)` | Heart of Ice | black, 20.2 to 1 |
| 24 | `#fbfeff` | `oklch(99.53% 0.0032 221.15)` | Polar Bear in a Blizzard | black, 20.7 to 1 |
| 25 | `#ffffff` | `oklch(100.00% 0.0000 197.04)` | White | black, 20.9 to 1 |
| 26 | `#ffffff` | `oklch(100.00% 0.0000 197.05)` | White | black, 20.9 to 1 |
| 27 | `#ffffff` | `oklch(100.00% 0.0000 197.06)` | White | black, 20.9 to 1 |
| 28 | `#ffffff` | `oklch(100.00% 0.0000 197.07)` | White | black, 20.9 to 1 |
| 29 | `#ffffff` | `oklch(100.00% 0.0000 197.07)` | White | black, 20.9 to 1 |
| 30 | `#fbffff` | `oklch(99.65% 0.0037 203.98)` | Polar Bear in a Blizzard | black, 20.8 to 1 |
| 31 | `#f2fdfe` | `oklch(98.68% 0.0119 202.84)` | Sparkling Snow | black, 20.2 to 1 |
| 32 | `#edf9fa` | `oklch(97.37% 0.0133 202.16)` | Silent Snowfall | black, 19.5 to 1 |
| 33 | `#e6f4f5` | `oklch(95.61% 0.0149 202.24)` | Milky Way | black, 18.5 to 1 |
| 34 | `#dcecee` | `oklch(93.20% 0.0171 203.04)` | Blue Flax | black, 17.2 to 1 |
| 35 | `#d0e3e5` | `oklch(90.21% 0.0198 204.44)` | Ski White | black, 15.7 to 1 |
| 36 | `#c3d8db` | `oklch(86.74% 0.0230 206.38)` | Barest Hint of Blue | black, 14.1 to 1 |
| 37 | `#b4ccd0` | `oklch(82.87% 0.0265 208.76)` | Pallid Blue | black, 12.4 to 1 |
| 38 | `#a4bfc5` | `oklch(78.69% 0.0303 211.49)` | Clear Vista | black, 10.8 to 1 |
| 39 | `#94b2b9` | `oklch(74.31% 0.0343 214.50)` | Bulfinch Blue | black, 9.3 to 1 |
| 40 | `#84a4ae` | `oklch(69.80% 0.0383 217.68)` | Blue Nuthatch | black, 7.9 to 1 |
| 41 | `#7496a2` | `oklch(65.27% 0.0424 220.95)` | Silver Fir Blue | black, 6.6 to 1 |
| 42 | `#648998` | `oklch(60.81% 0.0465 224.22)` | Horizon | black, 5.5 to 1 |
| 43 | `#567c8d` | `oklch(56.50% 0.0504 227.42)` | Technical Blue | black, 4.6 to 1 |
| 44 | `#497084` | `oklch(52.44% 0.0540 230.44)` | Shipyard | white, 5.3 to 1 |
| 45 | `#3d657b` | `oklch(48.72% 0.0574 233.21)` | Noshime Flower | white, 6.2 to 1 |
| 46 | `#335c74` | `oklch(45.44% 0.0603 235.63)` | Shasta Lake | white, 7.2 to 1 |
| 47 | `#2a546d` | `oklch(42.69% 0.0628 237.62)` | Diver Lady | white, 8.1 to 1 |
| 48 | `#244e68` | `oklch(40.55% 0.0648 239.09)` | Seafarer | white, 8.9 to 1 |

## CSS

```css
background: linear-gradient(45deg, #237e9e 0.0%, #2e81a1 2.1%, #3986a5 4.3%, #468caa 6.4%, #5392b0 8.5%, #6099b5 10.6%, #6da0bc 12.8%, #7ba8c2 14.9%, #88b0c8 17.0%, #95b8ce 19.1%, #a2c0d4 21.3%, #aec7da 23.4%, #b9cfdf 25.5%, #c3d6e4 27.7%, #ccdce8 29.8%, #d4e1eb 31.9%, #dae6ee 34.0%, #e0eaf1 36.2%, #e5eef4 38.3%, #eaf2f7 40.4%, #eef6fa 42.6%, #f2f9fd 44.7%, #f6fcff 46.8%, #fbfeff 48.9%, #ffffff 51.1%, #ffffff 53.2%, #ffffff 55.3%, #ffffff 57.4%, #ffffff 59.6%, #fbffff 61.7%, #f2fdfe 63.8%, #edf9fa 66.0%, #e6f4f5 68.1%, #dcecee 70.2%, #d0e3e5 72.3%, #c3d8db 74.5%, #b4ccd0 76.6%, #a4bfc5 78.7%, #94b2b9 80.9%, #84a4ae 83.0%, #7496a2 85.1%, #648998 87.2%, #567c8d 89.4%, #497084 91.5%, #3d657b 93.6%, #335c74 95.7%, #2a546d 97.9%, #244e68 100.0%);
background: linear-gradient(45deg in oklch, oklch(55.51% 0.0951 226.41) 0.0%, oklch(56.85% 0.0922 227.00) 2.1%, oklch(58.56% 0.0885 227.86) 4.3%, oklch(60.58% 0.0840 228.94) 6.4%, oklch(62.86% 0.0791 230.20) 8.5%, oklch(65.35% 0.0736 231.57) 10.6%, oklch(67.99% 0.0678 233.01) 12.8%, oklch(70.74% 0.0618 234.46) 14.9%, oklch(73.55% 0.0557 235.88) 17.0%, oklch(76.36% 0.0496 237.22) 19.1%, oklch(79.12% 0.0437 238.42) 21.3%, oklch(81.78% 0.0379 239.43) 23.4%, oklch(84.28% 0.0326 240.20) 25.5%, oklch(86.59% 0.0277 240.67) 27.7%, oklch(88.63% 0.0234 240.81) 29.8%, oklch(90.37% 0.0198 240.56) 31.9%, oklch(91.78% 0.0171 239.85) 34.0%, oklch(93.09% 0.0148 238.50) 36.2%, oklch(94.38% 0.0128 236.56) 38.3%, oklch(95.61% 0.0112 234.13) 40.4%, oklch(96.77% 0.0100 231.29) 42.6%, oklch(97.82% 0.0090 228.16) 44.7%, oklch(98.75% 0.0080 224.73) 46.8%, oklch(99.53% 0.0032 221.15) 48.9%, oklch(100.00% 0.0000 197.04) 51.1%, oklch(100.00% 0.0000 197.05) 53.2%, oklch(100.00% 0.0000 197.06) 55.3%, oklch(100.00% 0.0000 197.07) 57.4%, oklch(100.00% 0.0000 197.07) 59.6%, oklch(99.65% 0.0037 203.98) 61.7%, oklch(98.68% 0.0119 202.84) 63.8%, oklch(97.37% 0.0133 202.16) 66.0%, oklch(95.61% 0.0149 202.24) 68.1%, oklch(93.20% 0.0171 203.04) 70.2%, oklch(90.21% 0.0198 204.44) 72.3%, oklch(86.74% 0.0230 206.38) 74.5%, oklch(82.87% 0.0265 208.76) 76.6%, oklch(78.69% 0.0303 211.49) 78.7%, oklch(74.31% 0.0343 214.50) 80.9%, oklch(69.80% 0.0383 217.68) 83.0%, oklch(65.27% 0.0424 220.95) 85.1%, oklch(60.81% 0.0465 224.22) 87.2%, oklch(56.50% 0.0504 227.42) 89.4%, oklch(52.44% 0.0540 230.44) 91.5%, oklch(48.72% 0.0574 233.21) 93.6%, oklch(45.44% 0.0603 235.63) 95.7%, oklch(42.69% 0.0628 237.62) 97.9%, oklch(40.55% 0.0648 239.09) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.555 | 0.095 | 226.4 |
| 2 | 0.913 | 0.018 | 240.1 |
| 3 | 0.969 | 0.014 | 202.1 |
| 4 | 0.406 | 0.065 | 239.1 |

## In these collections

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

## Other forms

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