# Monochrome light blue to navy linear gradient

Monochrome light blue to navy linear gradient with 13 colors: #e2f2fe, #d0e8fb, #b7d9f6, #9cc7ef, #84b5e6, #6fa0d9, #5c89ca, #4d72b9, #425da7, #3a4a95, #343781, #2f286f, #2a1d63. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kU8hGr4CBA78swelqsIg`
- Page: https://grabient.com/kU8hGr4CBA78swelqsIg?steps=13&angle=45
- Drawn as: linear gradient, 13 steps, 45 degrees
- Kinds: light to dark, cool
- Hues: analogous
- Contrast of its darkest and lightest colors: 12.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 | `#e2f2fe` | `oklch(95.28% 0.0234 241.17)` | Wizard White | black, 18.3 to 1 |
| 2 | `#d0e8fb` | `oklch(91.89% 0.0358 242.49)` | Veiling Waterfalls | black, 16.5 to 1 |
| 3 | `#b7d9f6` | `oklch(87.06% 0.0537 244.34)` | Oh Boy! | black, 14.2 to 1 |
| 4 | `#9cc7ef` | `oklch(81.42% 0.0726 246.72)` | Baby Blue Eyes | black, 11.8 to 1 |
| 5 | `#84b5e6` | `oklch(75.59% 0.0882 249.63)` | Aero | black, 9.6 to 1 |
| 6 | `#6fa0d9` | `oklch(69.40% 0.0999 253.21)` | Kindred | black, 7.7 to 1 |
| 7 | `#5c89ca` | `oklch(62.62% 0.1098 257.42)` | Marina | black, 5.8 to 1 |
| 8 | `#4d72b9` | `oklch(55.83% 0.1175 261.96)` | Sinatra | white, 4.7 to 1 |
| 9 | `#425da7` | `oklch(49.61% 0.1226 266.53)` | Kakitsubata Blue | white, 6.2 to 1 |
| 10 | `#3a4a95` | `oklch(43.70% 0.1239 271.59)` | Deep Ultramarine | white, 8 to 1 |
| 11 | `#343781` | `oklch(37.94% 0.1220 277.10)` | Ballpoint Indigo | white, 10.4 to 1 |
| 12 | `#2f286f` | `oklch(33.00% 0.1191 282.09)` | Blue Rose | white, 12.7 to 1 |
| 13 | `#2a1d63` | `oklch(29.53% 0.1171 285.56)` | Night Fog | white, 14.4 to 1 |

## CSS

```css
background: linear-gradient(45deg, #e2f2fe 0.0%, #d0e8fb 8.3%, #b7d9f6 16.7%, #9cc7ef 25.0%, #84b5e6 33.3%, #6fa0d9 41.7%, #5c89ca 50.0%, #4d72b9 58.3%, #425da7 66.7%, #3a4a95 75.0%, #343781 83.3%, #2f286f 91.7%, #2a1d63 100.0%);
background: linear-gradient(45deg in oklch, oklch(95.28% 0.0234 241.17) 0.0%, oklch(91.89% 0.0358 242.49) 8.3%, oklch(87.06% 0.0537 244.34) 16.7%, oklch(81.42% 0.0726 246.72) 25.0%, oklch(75.59% 0.0882 249.63) 33.3%, oklch(69.40% 0.0999 253.21) 41.7%, oklch(62.62% 0.1098 257.42) 50.0%, oklch(55.83% 0.1175 261.96) 58.3%, oklch(49.61% 0.1226 266.53) 66.7%, oklch(43.70% 0.1239 271.59) 75.0%, oklch(37.94% 0.1220 277.10) 83.3%, oklch(33.00% 0.1191 282.09) 91.7%, oklch(29.53% 0.1171 285.56) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.953 | 0.023 | 241.2 |
| 2 | 0.756 | 0.088 | 249.6 |
| 3 | 0.496 | 0.123 | 266.5 |
| 4 | 0.295 | 0.117 | 285.6 |

## In these collections

- [Sky](https://grabient.com/sky)

## Other forms

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