# Cool blue to light blue linear gradient

Cool blue to light blue linear gradient with 32 colors: #023e94, #014296, #004799, #004d9d, #0054a1, #015ba6, #0462aa, #0869ae, #0d70b3, #1278b6, #167eba, #1a85bd, #1e8cc0, #2293c3, #269ac5, #2ca1c8, #32a7ca, #39aecb, #41b4cd, #49b9ce, #51becf, #58c1cf, #60c4cf, #67c7cf, #6ec9cf, #75cace, #7bccce, #81cccd, #86cdcd, #8acecd, #8ececc, #91cfcc. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kUY264yS29t-kPBnFz4g`
- Page: https://grabient.com/kUY264yS29t-kPBnFz4g?steps=32&angle=135
- Drawn as: linear gradient, 32 steps, 135 degrees
- Kinds: dark to light, vivid, cool
- Hues: analogous
- Contrast of its darkest and lightest colors: 5.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 | `#023e94` | `oklch(38.98% 0.1516 259.45)` | Amalfitan Azure | white, 9.8 to 1 |
| 2 | `#014296` | `oklch(40.04% 0.1501 258.42)` | Fright Night | white, 9.4 to 1 |
| 3 | `#004799` | `oklch(41.41% 0.1481 257.19)` | Fright Night | white, 8.8 to 1 |
| 4 | `#004d9d` | `oklch(43.02% 0.1456 255.77)` | Freshwater Lake | white, 8.2 to 1 |
| 5 | `#0054a1` | `oklch(44.83% 0.1433 254.13)` | Princess Blue | white, 7.5 to 1 |
| 6 | `#015ba6` | `oklch(46.78% 0.1406 252.31)` | Raiden Blue | white, 6.9 to 1 |
| 7 | `#0462aa` | `oklch(48.83% 0.1377 250.35)` | Directoire Blue | white, 6.3 to 1 |
| 8 | `#0869ae` | `oklch(50.92% 0.1348 248.25)` | Wing Commander | white, 5.7 to 1 |
| 9 | `#0d70b3` | `oklch(52.99% 0.1318 246.03)` | Cobalt Glaze | white, 5.2 to 1 |
| 10 | `#1278b6` | `oklch(55.00% 0.1290 243.70)` | Americana | white, 4.8 to 1 |
| 11 | `#167eba` | `oklch(56.89% 0.1263 241.26)` | Meissen Blue | black, 4.7 to 1 |
| 12 | `#1a85bd` | `oklch(58.67% 0.1237 238.67)` | Ibiza Blue | black, 5.1 to 1 |
| 13 | `#1e8cc0` | `oklch(60.51% 0.1213 235.73)` | Cyan Cornflower Blue | black, 5.5 to 1 |
| 14 | `#2293c3` | `oklch(62.40% 0.1189 232.51)` | Porpita Porpita | black, 6 to 1 |
| 15 | `#269ac5` | `oklch(64.30% 0.1165 229.09)` | Stratos Blue | black, 6.4 to 1 |
| 16 | `#2ca1c8` | `oklch(66.20% 0.1141 225.57)` | Charybdis | black, 7 to 1 |
| 17 | `#32a7ca` | `oklch(68.04% 0.1117 222.02)` | Laguna | black, 7.5 to 1 |
| 18 | `#39aecb` | `oklch(69.81% 0.1092 218.53)` | River Blue | black, 8 to 1 |
| 19 | `#41b4cd` | `oklch(71.48% 0.1067 215.19)` | Viking | black, 8.6 to 1 |
| 20 | `#49b9ce` | `oklch(73.02% 0.1040 212.09)` | Glimpse | black, 9.1 to 1 |
| 21 | `#51becf` | `oklch(74.39% 0.1012 209.31)` | Skink Blue | black, 9.5 to 1 |
| 22 | `#58c1cf` | `oklch(75.57% 0.0982 206.92)` | Baharroth Blue | black, 9.9 to 1 |
| 23 | `#60c4cf` | `oklch(76.58% 0.0948 204.78)` | Arctic Ocean | black, 10.3 to 1 |
| 24 | `#67c7cf` | `oklch(77.45% 0.0911 202.82)` | Paradise Sky | black, 10.6 to 1 |
| 25 | `#6ec9cf` | `oklch(78.18% 0.0871 201.05)` | Tropical Splash | black, 10.9 to 1 |
| 26 | `#75cace` | `oklch(78.81% 0.0830 199.44)` | Tropical Splash | black, 11.1 to 1 |
| 27 | `#7bccce` | `oklch(79.34% 0.0790 198.00)` | Aqua Belt | black, 11.3 to 1 |
| 28 | `#81cccd` | `oklch(79.79% 0.0751 196.70)` | White Ultramarine | black, 11.4 to 1 |
| 29 | `#86cdcd` | `oklch(80.17% 0.0715 195.55)` | Aqua Splash | black, 11.6 to 1 |
| 30 | `#8acecd` | `oklch(80.51% 0.0682 194.54)` | Aaquatic Wonderland | black, 11.7 to 1 |
| 31 | `#8ececc` | `oklch(80.81% 0.0655 193.65)` | Aaquatic Wonderland | black, 11.8 to 1 |
| 32 | `#91cfcc` | `oklch(81.10% 0.0634 192.88)` | Lake | black, 11.9 to 1 |

## CSS

```css
background: linear-gradient(135deg, #023e94 0.0%, #014296 3.2%, #004799 6.5%, #004d9d 9.7%, #0054a1 12.9%, #015ba6 16.1%, #0462aa 19.4%, #0869ae 22.6%, #0d70b3 25.8%, #1278b6 29.0%, #167eba 32.3%, #1a85bd 35.5%, #1e8cc0 38.7%, #2293c3 41.9%, #269ac5 45.2%, #2ca1c8 48.4%, #32a7ca 51.6%, #39aecb 54.8%, #41b4cd 58.1%, #49b9ce 61.3%, #51becf 64.5%, #58c1cf 67.7%, #60c4cf 71.0%, #67c7cf 74.2%, #6ec9cf 77.4%, #75cace 80.6%, #7bccce 83.9%, #81cccd 87.1%, #86cdcd 90.3%, #8acecd 93.5%, #8ececc 96.8%, #91cfcc 100.0%);
background: linear-gradient(135deg in oklch, oklch(38.98% 0.1516 259.45) 0.0%, oklch(40.04% 0.1501 258.42) 3.2%, oklch(41.41% 0.1481 257.19) 6.5%, oklch(43.02% 0.1456 255.77) 9.7%, oklch(44.83% 0.1433 254.13) 12.9%, oklch(46.78% 0.1406 252.31) 16.1%, oklch(48.83% 0.1377 250.35) 19.4%, oklch(50.92% 0.1348 248.25) 22.6%, oklch(52.99% 0.1318 246.03) 25.8%, oklch(55.00% 0.1290 243.70) 29.0%, oklch(56.89% 0.1263 241.26) 32.3%, oklch(58.67% 0.1237 238.67) 35.5%, oklch(60.51% 0.1213 235.73) 38.7%, oklch(62.40% 0.1189 232.51) 41.9%, oklch(64.30% 0.1165 229.09) 45.2%, oklch(66.20% 0.1141 225.57) 48.4%, oklch(68.04% 0.1117 222.02) 51.6%, oklch(69.81% 0.1092 218.53) 54.8%, oklch(71.48% 0.1067 215.19) 58.1%, oklch(73.02% 0.1040 212.09) 61.3%, oklch(74.39% 0.1012 209.31) 64.5%, oklch(75.57% 0.0982 206.92) 67.7%, oklch(76.58% 0.0948 204.78) 71.0%, oklch(77.45% 0.0911 202.82) 74.2%, oklch(78.18% 0.0871 201.05) 77.4%, oklch(78.81% 0.0830 199.44) 80.6%, oklch(79.34% 0.0790 198.00) 83.9%, oklch(79.79% 0.0751 196.70) 87.1%, oklch(80.17% 0.0715 195.55) 90.3%, oklch(80.51% 0.0682 194.54) 93.5%, oklch(80.81% 0.0655 193.65) 96.8%, oklch(81.10% 0.0634 192.88) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.39 | 0.152 | 259.5 |
| 2 | 0.575 | 0.125 | 240.4 |
| 3 | 0.752 | 0.099 | 207.7 |
| 4 | 0.811 | 0.063 | 192.9 |

## In these collections

- [Coastal gradients](https://grabient.com/coastal-gradients)
- [Desktop wallpaper gradients](https://grabient.com/desktop-wallpaper-gradients)
- [Sky](https://grabient.com/sky)

## Other forms

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