# White to baby blue

Monochrome white to light blue linear gradient with 32 colors: #ffffff, #fefeff, #fcfeff, #fafdfe, #f8fcfe, #f5fbfe, #f2f9fe, #f0f8fd, #edf7fd, #eaf5fd, #e7f4fc, #e4f3fc, #e1f1fc, #ddf0fb, #daeefb, #d7edfa, #d5ebfa, #d1eaf9, #cee8f9, #cbe6f8, #c7e4f7, #c4e2f6, #c0e0f6, #bddef5, #b9dcf4, #b6daf3, #b3d8f3, #b0d6f2, #add5f1, #abd3f1, #a9d2f0, #a7d1f0. Edit it and copy or download CSS, SVG, PNG or shader code.

- Also called: Monochrome white to light blue linear gradient
- Seed: `kCP4Ap7rdn0NPo-A`
- Page: https://grabient.com/kCP4Ap7rdn0NPo-A?steps=32&angle=135
- Drawn as: linear gradient, 32 steps, 135 degrees
- Kinds: pastel, light, cool, monochrome
- Hues: monochromatic
- Contrast of its darkest and lightest colors: 1.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 | `#ffffff` | `oklch(100.00% 0.0000 89.88)` | White | black, 21 to 1 |
| 2 | `#fefeff` | `oklch(99.75% 0.0011 235.54)` | White as Heaven | black, 20.8 to 1 |
| 3 | `#fcfeff` | `oklch(99.46% 0.0024 235.52)` | Polar Bear in a Blizzard | black, 20.6 to 1 |
| 4 | `#fafdfe` | `oklch(99.13% 0.0039 235.49)` | Emptiness | black, 20.4 to 1 |
| 5 | `#f8fcfe` | `oklch(98.76% 0.0056 235.45)` | Deutzia White | black, 20.2 to 1 |
| 6 | `#f5fbfe` | `oklch(98.36% 0.0074 235.40)` | Deutzia White | black, 20 to 1 |
| 7 | `#f2f9fe` | `oklch(97.93% 0.0094 235.36)` | Alice Blue | black, 19.8 to 1 |
| 8 | `#f0f8fd` | `oklch(97.48% 0.0114 235.32)` | Alice Blue | black, 19.5 to 1 |
| 9 | `#edf7fd` | `oklch(97.00% 0.0136 235.28)` | Silent Snowfall | black, 19.2 to 1 |
| 10 | `#eaf5fd` | `oklch(96.50% 0.0158 235.26)` | Moon White | black, 19 to 1 |
| 11 | `#e7f4fc` | `oklch(95.99% 0.0181 235.25)` | Kodama White | black, 18.7 to 1 |
| 12 | `#e4f3fc` | `oklch(95.47% 0.0203 235.26)` | Kodama White | black, 18.4 to 1 |
| 13 | `#e1f1fc` | `oklch(94.95% 0.0226 235.30)` | Wizard White | black, 18.1 to 1 |
| 14 | `#ddf0fb` | `oklch(94.42% 0.0248 235.35)` | Wizard White | black, 17.9 to 1 |
| 15 | `#daeefb` | `oklch(93.89% 0.0270 235.44)` | Hoarfrost | black, 17.6 to 1 |
| 16 | `#d7edfa` | `oklch(93.37% 0.0291 235.56)` | Ice Castle | black, 17.3 to 1 |
| 17 | `#d5ebfa` | `oklch(92.85% 0.0311 235.72)` | Cloudless | black, 17.1 to 1 |
| 18 | `#d1eaf9` | `oklch(92.29% 0.0333 235.94)` | Freezing Vapour | black, 16.8 to 1 |
| 19 | `#cee8f9` | `oklch(91.68% 0.0355 236.20)` | Freezing Vapour | black, 16.5 to 1 |
| 20 | `#cbe6f8` | `oklch(91.05% 0.0378 236.50)` | Icy Landscape | black, 16.2 to 1 |
| 21 | `#c7e4f7` | `oklch(90.39% 0.0402 236.83)` | Fresh Water | black, 15.8 to 1 |
| 22 | `#c4e2f6` | `oklch(89.71% 0.0426 237.19)` | Fresh Water | black, 15.5 to 1 |
| 23 | `#c0e0f6` | `oklch(89.03% 0.0450 237.56)` | Tropical Pool | black, 15.2 to 1 |
| 24 | `#bddef5` | `oklch(88.35% 0.0474 237.95)` | Arctic Paradise | black, 14.9 to 1 |
| 25 | `#b9dcf4` | `oklch(87.69% 0.0497 238.33)` | Greek Isles | black, 14.6 to 1 |
| 26 | `#b6daf3` | `oklch(87.04% 0.0519 238.71)` | Blue Rice | black, 14.3 to 1 |
| 27 | `#b3d8f3` | `oklch(86.43% 0.0541 239.08)` | Blue Rice | black, 14 to 1 |
| 28 | `#b0d6f2` | `oklch(85.85% 0.0561 239.42)` | Blue Rice | black, 13.7 to 1 |
| 29 | `#add5f1` | `oklch(85.32% 0.0579 239.74)` | Light Shimmer | black, 13.5 to 1 |
| 30 | `#abd3f1` | `oklch(84.85% 0.0595 240.02)` | Light Shimmer | black, 13.3 to 1 |
| 31 | `#a9d2f0` | `oklch(84.45% 0.0609 240.25)` | Marzena Dream | black, 13.1 to 1 |
| 32 | `#a7d1f0` | `oklch(84.12% 0.0621 240.44)` | Marzena Dream | black, 13 to 1 |

## CSS

```css
background: linear-gradient(135deg, #ffffff 0.0%, #fefeff 3.2%, #fcfeff 6.5%, #fafdfe 9.7%, #f8fcfe 12.9%, #f5fbfe 16.1%, #f2f9fe 19.4%, #f0f8fd 22.6%, #edf7fd 25.8%, #eaf5fd 29.0%, #e7f4fc 32.3%, #e4f3fc 35.5%, #e1f1fc 38.7%, #ddf0fb 41.9%, #daeefb 45.2%, #d7edfa 48.4%, #d5ebfa 51.6%, #d1eaf9 54.8%, #cee8f9 58.1%, #cbe6f8 61.3%, #c7e4f7 64.5%, #c4e2f6 67.7%, #c0e0f6 71.0%, #bddef5 74.2%, #b9dcf4 77.4%, #b6daf3 80.6%, #b3d8f3 83.9%, #b0d6f2 87.1%, #add5f1 90.3%, #abd3f1 93.5%, #a9d2f0 96.8%, #a7d1f0 100.0%);
background: linear-gradient(135deg in oklch, oklch(100.00% 0.0000 89.88) 0.0%, oklch(99.75% 0.0011 235.54) 3.2%, oklch(99.46% 0.0024 235.52) 6.5%, oklch(99.13% 0.0039 235.49) 9.7%, oklch(98.76% 0.0056 235.45) 12.9%, oklch(98.36% 0.0074 235.40) 16.1%, oklch(97.93% 0.0094 235.36) 19.4%, oklch(97.48% 0.0114 235.32) 22.6%, oklch(97.00% 0.0136 235.28) 25.8%, oklch(96.50% 0.0158 235.26) 29.0%, oklch(95.99% 0.0181 235.25) 32.3%, oklch(95.47% 0.0203 235.26) 35.5%, oklch(94.95% 0.0226 235.30) 38.7%, oklch(94.42% 0.0248 235.35) 41.9%, oklch(93.89% 0.0270 235.44) 45.2%, oklch(93.37% 0.0291 235.56) 48.4%, oklch(92.85% 0.0311 235.72) 51.6%, oklch(92.29% 0.0333 235.94) 54.8%, oklch(91.68% 0.0355 236.20) 58.1%, oklch(91.05% 0.0378 236.50) 61.3%, oklch(90.39% 0.0402 236.83) 64.5%, oklch(89.71% 0.0426 237.19) 67.7%, oklch(89.03% 0.0450 237.56) 71.0%, oklch(88.35% 0.0474 237.95) 74.2%, oklch(87.69% 0.0497 238.33) 77.4%, oklch(87.04% 0.0519 238.71) 80.6%, oklch(86.43% 0.0541 239.08) 83.9%, oklch(85.85% 0.0561 239.42) 87.1%, oklch(85.32% 0.0579 239.74) 90.3%, oklch(84.85% 0.0595 240.02) 93.5%, oklch(84.45% 0.0609 240.25) 96.8%, oklch(84.12% 0.0621 240.44) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 1 | 0 | 235.5 |
| 2 | 0.931 | 0.03 | 235.6 |
| 3 | 0.841 | 0.062 | 240.4 |

## In these collections

- [Light blue gradients](https://grabient.com/light-blue-gradients)

## Other forms

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