# Monochrome black to light blue linear gradient

Monochrome black to light blue linear gradient with 32 colors: #06070a, #080a10, #0b0f16, #0e141f, #121a29, #172134, #1d283f, #22304c, #283858, #2e4065, #344870, #3a4f7b, #405786, #466092, #4c699e, #5371a9, #597ab5, #6083bf, #668cca, #6d95d3, #749edb, #7aa6e3, #82aee8, #8ab6ed, #92bdf1, #9bc5f3, #a4ccf5, #add2f7, #b6d8f8, #beddf9, #c5e1fa, #cbe5fb. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kUIQa6NJtANolPzzjz5A`
- Page: https://grabient.com/kUIQa6NJtANolPzzjz5A?steps=32&angle=135
- Drawn as: linear gradient, 32 steps, 135 degrees
- Kinds: dark to light, muted, cool, monochrome
- Hues: analogous
- Contrast of its darkest and lightest colors: 15.4 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 | `#06070a` | `oklch(12.99% 0.0083 261.56)` | Reversed Grey | white, 20.1 to 1 |
| 2 | `#080a10` | `oklch(14.61% 0.0122 261.72)` | Dark Rift | white, 19.7 to 1 |
| 3 | `#0b0f16` | `oklch(16.68% 0.0175 261.97)` | Nyctophobia | white, 19.2 to 1 |
| 4 | `#0e141f` | `oklch(19.11% 0.0238 262.27)` | Midnight Edition | white, 18.4 to 1 |
| 5 | `#121a29` | `oklch(21.85% 0.0308 262.62)` | Sambucus | white, 17.3 to 1 |
| 6 | `#172134` | `oklch(24.81% 0.0383 262.96)` | Kon | white, 16.1 to 1 |
| 7 | `#1d283f` | `oklch(27.92% 0.0460 263.28)` | Eternal Darkness | white, 14.6 to 1 |
| 8 | `#22304c` | `oklch(31.11% 0.0536 263.55)` | Manganese Black | white, 13.1 to 1 |
| 9 | `#283858` | `oklch(34.30% 0.0608 263.73)` | Mediaeval Blue | white, 11.6 to 1 |
| 10 | `#2e4065` | `oklch(37.42% 0.0673 263.80)` | Elmer’s Echo | white, 10.3 to 1 |
| 11 | `#344870` | `oklch(40.39% 0.0728 263.73)` | Midnight Interlude | white, 9.1 to 1 |
| 12 | `#3a4f7b` | `oklch(43.23% 0.0774 263.52)` | Noble Knight | white, 8 to 1 |
| 13 | `#405786` | `oklch(46.14% 0.0820 263.21)` | True Navy | white, 7.1 to 1 |
| 14 | `#466092` | `oklch(49.11% 0.0864 262.82)` | Last Light Blue | white, 6.2 to 1 |
| 15 | `#4c699e` | `oklch(52.11% 0.0906 262.35)` | San Marino | white, 5.5 to 1 |
| 16 | `#5371a9` | `oklch(55.12% 0.0944 261.80)` | Plunder | white, 4.8 to 1 |
| 17 | `#597ab5` | `oklch(58.11% 0.0977 261.17)` | Blue Android Base | black, 4.8 to 1 |
| 18 | `#6083bf` | `oklch(61.04% 0.1003 260.47)` | Bodega Bay | black, 5.5 to 1 |
| 19 | `#668cca` | `oklch(63.89% 0.1021 259.71)` | Royal Regatta | black, 6.1 to 1 |
| 20 | `#6d95d3` | `oklch(66.63% 0.1029 258.87)` | Bashful Blue | black, 6.8 to 1 |
| 21 | `#749edb` | `oklch(69.23% 0.1028 257.97)` | Ice Blue | black, 7.6 to 1 |
| 22 | `#7aa6e3` | `oklch(71.67% 0.1013 257.00)` | Greek Sea | black, 8.3 to 1 |
| 23 | `#82aee8` | `oklch(74.06% 0.0980 255.83)` | Pool Floor | black, 9.1 to 1 |
| 24 | `#8ab6ed` | `oklch(76.44% 0.0930 254.46)` | Electric Eel | black, 9.9 to 1 |
| 25 | `#92bdf1` | `oklch(78.75% 0.0868 252.97)` | Electric Eel | black, 10.8 to 1 |
| 26 | `#9bc5f3` | `oklch(80.98% 0.0797 251.40)` | Sail to the Sea | black, 11.6 to 1 |
| 27 | `#a4ccf5` | `oklch(83.09% 0.0721 249.81)` | Baby Blue Eyes | black, 12.5 to 1 |
| 28 | `#add2f7` | `oklch(85.07% 0.0644 248.26)` | Ice Cold Stare | black, 13.3 to 1 |
| 29 | `#b6d8f8` | `oklch(86.87% 0.0571 246.80)` | Oh Boy! | black, 14.1 to 1 |
| 30 | `#beddf9` | `oklch(88.47% 0.0506 245.50)` | Dithered Sky | black, 14.9 to 1 |
| 31 | `#c5e1fa` | `oklch(89.83% 0.0452 244.42)` | Fresh Water | black, 15.5 to 1 |
| 32 | `#cbe5fb` | `oklch(90.94% 0.0413 243.60)` | Fresh Water | black, 16.1 to 1 |

## CSS

```css
background: linear-gradient(135deg, #06070a 0.0%, #080a10 3.2%, #0b0f16 6.5%, #0e141f 9.7%, #121a29 12.9%, #172134 16.1%, #1d283f 19.4%, #22304c 22.6%, #283858 25.8%, #2e4065 29.0%, #344870 32.3%, #3a4f7b 35.5%, #405786 38.7%, #466092 41.9%, #4c699e 45.2%, #5371a9 48.4%, #597ab5 51.6%, #6083bf 54.8%, #668cca 58.1%, #6d95d3 61.3%, #749edb 64.5%, #7aa6e3 67.7%, #82aee8 71.0%, #8ab6ed 74.2%, #92bdf1 77.4%, #9bc5f3 80.6%, #a4ccf5 83.9%, #add2f7 87.1%, #b6d8f8 90.3%, #beddf9 93.5%, #c5e1fa 96.8%, #cbe5fb 100.0%);
background: linear-gradient(135deg in oklch, oklch(12.99% 0.0083 261.56) 0.0%, oklch(14.61% 0.0122 261.72) 3.2%, oklch(16.68% 0.0175 261.97) 6.5%, oklch(19.11% 0.0238 262.27) 9.7%, oklch(21.85% 0.0308 262.62) 12.9%, oklch(24.81% 0.0383 262.96) 16.1%, oklch(27.92% 0.0460 263.28) 19.4%, oklch(31.11% 0.0536 263.55) 22.6%, oklch(34.30% 0.0608 263.73) 25.8%, oklch(37.42% 0.0673 263.80) 29.0%, oklch(40.39% 0.0728 263.73) 32.3%, oklch(43.23% 0.0774 263.52) 35.5%, oklch(46.14% 0.0820 263.21) 38.7%, oklch(49.11% 0.0864 262.82) 41.9%, oklch(52.11% 0.0906 262.35) 45.2%, oklch(55.12% 0.0944 261.80) 48.4%, oklch(58.11% 0.0977 261.17) 51.6%, oklch(61.04% 0.1003 260.47) 54.8%, oklch(63.89% 0.1021 259.71) 58.1%, oklch(66.63% 0.1029 258.87) 61.3%, oklch(69.23% 0.1028 257.97) 64.5%, oklch(71.67% 0.1013 257.00) 67.7%, oklch(74.06% 0.0980 255.83) 71.0%, oklch(76.44% 0.0930 254.46) 74.2%, oklch(78.75% 0.0868 252.97) 77.4%, oklch(80.98% 0.0797 251.40) 80.6%, oklch(83.09% 0.0721 249.81) 83.9%, oklch(85.07% 0.0644 248.26) 87.1%, oklch(86.87% 0.0571 246.80) 90.3%, oklch(88.47% 0.0506 245.50) 93.5%, oklch(89.83% 0.0452 244.42) 96.8%, oklch(90.94% 0.0413 243.60) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.13 | 0.008 | 261.6 |
| 2 | 0.413 | 0.074 | 263.7 |
| 3 | 0.709 | 0.102 | 257.3 |
| 4 | 0.909 | 0.041 | 243.6 |

## In these collections

- [Ocean gradients](https://grabient.com/ocean-gradients)
- [Blue gradients](https://grabient.com/blue-gradients)

## Other forms

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