# Morning sky

Pastel monochrome blue linear gradient with 32 colors: #f0f9ff, #edf8ff, #e9f6ff, #e5f5ff, #e0f3ff, #daf1ff, #d4effe, #ceedfe, #c8ebfe, #c2e9fd, #bce7fd, #b6e5fd, #b1e3fd, #abe1fd, #a5dffd, #9fdefd, #99dcfd, #93dafd, #8dd8fc, #87d6fc, #81d4fc, #7bd2fc, #75d0fc, #6ecefb, #67cbfb, #5fc9fa, #58c7fa, #51c4f9, #4ac2f9, #43c0f9, #3dbef8, #38bdf8. Edit it and copy or download CSS, SVG, PNG or shader code.

- Also called: Pastel monochrome blue linear gradient
- Seed: `kEfD5_265v0X3T_BOL34A`
- Page: https://grabient.com/kEfD5_265v0X3T_BOL34A?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: 2 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 | `#f0f9ff` | `oklch(97.71% 0.0125 236.62)` | Alice Blue | black, 19.6 to 1 |
| 2 | `#edf8ff` | `oklch(97.28% 0.0149 236.27)` | Alice Blue | black, 19.4 to 1 |
| 3 | `#e9f6ff` | `oklch(96.72% 0.0181 235.80)` | Kodama White | black, 19.1 to 1 |
| 4 | `#e5f5ff` | `oklch(96.06% 0.0217 235.22)` | Kodama White | black, 18.8 to 1 |
| 5 | `#e0f3ff` | `oklch(95.32% 0.0259 234.59)` | Wizard White | black, 18.4 to 1 |
| 6 | `#daf1ff` | `oklch(94.52% 0.0304 233.91)` | Wizard White | black, 17.9 to 1 |
| 7 | `#d4effe` | `oklch(93.69% 0.0351 233.23)` | Ice Castle | black, 17.5 to 1 |
| 8 | `#ceedfe` | `oklch(92.83% 0.0399 232.57)` | Blue Hijab | black, 17.1 to 1 |
| 9 | `#c8ebfe` | `oklch(91.98% 0.0447 231.96)` | Blue Java Banana | black, 16.7 to 1 |
| 10 | `#c2e9fd` | `oklch(91.16% 0.0495 231.43)` | Blue Java Banana | black, 16.3 to 1 |
| 11 | `#bce7fd` | `oklch(90.38% 0.0540 231.01)` | Icy Landscape | black, 15.9 to 1 |
| 12 | `#b6e5fd` | `oklch(89.66% 0.0584 230.71)` | Frozen Landscape | black, 15.5 to 1 |
| 13 | `#b1e3fd` | `oklch(88.94% 0.0628 230.48)` | Frozen Landscape | black, 15.2 to 1 |
| 14 | `#abe1fd` | `oklch(88.22% 0.0673 230.31)` | Frozen Landscape | black, 14.9 to 1 |
| 15 | `#a5dffd` | `oklch(87.51% 0.0719 230.20)` | Droplet | black, 14.6 to 1 |
| 16 | `#9fdefd` | `oklch(86.79% 0.0764 230.13)` | Columbia Blue | black, 14.3 to 1 |
| 17 | `#99dcfd` | `oklch(86.08% 0.0810 230.10)` | Gas Giant | black, 13.9 to 1 |
| 18 | `#93dafd` | `oklch(85.37% 0.0855 230.10)` | Shiva Blue | black, 13.6 to 1 |
| 19 | `#8dd8fc` | `oklch(84.66% 0.0900 230.13)` | Tranquil Pool | black, 13.3 to 1 |
| 20 | `#87d6fc` | `oklch(83.95% 0.0943 230.19)` | Kul Sharif Blue | black, 13 to 1 |
| 21 | `#81d4fc` | `oklch(83.24% 0.0985 230.26)` | Kul Sharif Blue | black, 12.7 to 1 |
| 22 | `#7bd2fc` | `oklch(82.52% 0.1026 230.35)` | Sky | black, 12.4 to 1 |
| 23 | `#75d0fc` | `oklch(81.75% 0.1068 230.49)` | Heisenberg Blue | black, 12.1 to 1 |
| 24 | `#6ecefb` | `oklch(80.94% 0.1111 230.70)` | Skyan | black, 11.8 to 1 |
| 25 | `#67cbfb` | `oklch(80.11% 0.1154 230.94)` | Skyan | black, 11.5 to 1 |
| 26 | `#5fc9fa` | `oklch(79.28% 0.1196 231.21)` | Skyan | black, 11.2 to 1 |
| 27 | `#58c7fa` | `oklch(78.46% 0.1237 231.50)` | Thor’s Thunder | black, 10.9 to 1 |
| 28 | `#51c4f9` | `oklch(77.68% 0.1275 231.79)` | Shovel Knight | black, 10.6 to 1 |
| 29 | `#4ac2f9` | `oklch(76.96% 0.1310 232.06)` | Shovel Knight | black, 10.3 to 1 |
| 30 | `#43c0f9` | `oklch(76.32% 0.1342 232.31)` | Shovel Knight | black, 10.1 to 1 |
| 31 | `#3dbef8` | `oklch(75.78% 0.1369 232.51)` | Megaman | black, 9.9 to 1 |
| 32 | `#38bdf8` | `oklch(75.35% 0.1390 232.66)` | Megaman | black, 9.8 to 1 |

## CSS

```css
background: linear-gradient(135deg, #f0f9ff 0.0%, #edf8ff 3.2%, #e9f6ff 6.5%, #e5f5ff 9.7%, #e0f3ff 12.9%, #daf1ff 16.1%, #d4effe 19.4%, #ceedfe 22.6%, #c8ebfe 25.8%, #c2e9fd 29.0%, #bce7fd 32.3%, #b6e5fd 35.5%, #b1e3fd 38.7%, #abe1fd 41.9%, #a5dffd 45.2%, #9fdefd 48.4%, #99dcfd 51.6%, #93dafd 54.8%, #8dd8fc 58.1%, #87d6fc 61.3%, #81d4fc 64.5%, #7bd2fc 67.7%, #75d0fc 71.0%, #6ecefb 74.2%, #67cbfb 77.4%, #5fc9fa 80.6%, #58c7fa 83.9%, #51c4f9 87.1%, #4ac2f9 90.3%, #43c0f9 93.5%, #3dbef8 96.8%, #38bdf8 100.0%);
background: linear-gradient(135deg in oklch, oklch(97.71% 0.0125 236.62) 0.0%, oklch(97.28% 0.0149 236.27) 3.2%, oklch(96.72% 0.0181 235.80) 6.5%, oklch(96.06% 0.0217 235.22) 9.7%, oklch(95.32% 0.0259 234.59) 12.9%, oklch(94.52% 0.0304 233.91) 16.1%, oklch(93.69% 0.0351 233.23) 19.4%, oklch(92.83% 0.0399 232.57) 22.6%, oklch(91.98% 0.0447 231.96) 25.8%, oklch(91.16% 0.0495 231.43) 29.0%, oklch(90.38% 0.0540 231.01) 32.3%, oklch(89.66% 0.0584 230.71) 35.5%, oklch(88.94% 0.0628 230.48) 38.7%, oklch(88.22% 0.0673 230.31) 41.9%, oklch(87.51% 0.0719 230.20) 45.2%, oklch(86.79% 0.0764 230.13) 48.4%, oklch(86.08% 0.0810 230.10) 51.6%, oklch(85.37% 0.0855 230.10) 54.8%, oklch(84.66% 0.0900 230.13) 58.1%, oklch(83.95% 0.0943 230.19) 61.3%, oklch(83.24% 0.0985 230.26) 64.5%, oklch(82.52% 0.1026 230.35) 67.7%, oklch(81.75% 0.1068 230.49) 71.0%, oklch(80.94% 0.1111 230.70) 74.2%, oklch(80.11% 0.1154 230.94) 77.4%, oklch(79.28% 0.1196 231.21) 80.6%, oklch(78.46% 0.1237 231.50) 83.9%, oklch(77.68% 0.1275 231.79) 87.1%, oklch(76.96% 0.1310 232.06) 90.3%, oklch(76.32% 0.1342 232.31) 93.5%, oklch(75.78% 0.1369 232.51) 96.8%, oklch(75.35% 0.1390 232.66) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.977 | 0.012 | 236.6 |
| 2 | 0.901 | 0.055 | 230.9 |
| 3 | 0.828 | 0.101 | 230.3 |
| 4 | 0.754 | 0.139 | 232.7 |

## In these collections

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

## Other forms

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