# Monochrome navy, blue and light blue radial gradient

Monochrome navy, blue and light blue radial gradient with 32 colors: #09183b, #0a1b42, #0b1f4c, #0d2459, #0e2967, #102f76, #123686, #143c95, #1643a2, #174ab0, #1851be, #1958cc, #1a60da, #1c68e7, #2071f3, #267afc, #3484ff, #448eff, #5398ff, #61a1ff, #6faaff, #7db2ff, #89bbff, #96c2ff, #a2c9ff, #aed1ff, #bad8ff, #c6dfff, #d1e5ff, #dbebff, #e3f0ff, #e9f3ff. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kWODO7tDo_07MP5nKD-ege_g`
- Page: https://grabient.com/kWODO7tDo_07MP5nKD-ege_g?style=radialGradient&steps=32
- Drawn as: radial gradient, 32 steps, 90 degrees
- Kinds: dark to light, vivid, cool, monochrome
- Hues: monochromatic
- Contrast of its darkest and lightest colors: 15.5 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 | `#09183b` | `oklch(22.05% 0.0703 263.67)` | Maastricht Blue | white, 17.4 to 1 |
| 2 | `#0a1b42` | `oklch(23.55% 0.0777 263.60)` | Maastricht Blue | white, 16.7 to 1 |
| 3 | `#0b1f4c` | `oklch(25.53% 0.0880 263.53)` | Oxford Blue | white, 15.9 to 1 |
| 4 | `#0d2459` | `oklch(27.90% 0.1003 263.44)` | Fibonacci Blue | white, 14.8 to 1 |
| 5 | `#0e2967` | `oklch(30.53% 0.1137 263.33)` | Old Glory Blue | white, 13.6 to 1 |
| 6 | `#102f76` | `oklch(33.33% 0.1274 263.19)` | Below the Surface | white, 12.3 to 1 |
| 7 | `#123686` | `oklch(36.17% 0.1406 263.02)` | Magnus Blue | white, 11.1 to 1 |
| 8 | `#143c95` | `oklch(38.96% 0.1524 262.81)` | Amalfitan Azure | white, 9.9 to 1 |
| 9 | `#1643a2` | `oklch(41.59% 0.1621 262.54)` | Indian Peafowl | white, 8.9 to 1 |
| 10 | `#174ab0` | `oklch(44.22% 0.1717 262.22)` | The Blues Brothers | white, 7.9 to 1 |
| 11 | `#1851be` | `oklch(46.91% 0.1816 261.85)` | Mourning Blue | white, 7.1 to 1 |
| 12 | `#1958cc` | `oklch(49.64% 0.1911 261.44)` | Dead Blue Eyes | white, 6.3 to 1 |
| 13 | `#1a60da` | `oklch(52.38% 0.1994 260.99)` | Bnei Brak Bay | white, 5.6 to 1 |
| 14 | `#1c68e7` | `oklch(55.13% 0.2059 260.54)` | Epic Blue | white, 5 to 1 |
| 15 | `#2071f3` | `oklch(57.84% 0.2098 260.09)` | Deep Sky Blue | black, 4.7 to 1 |
| 16 | `#267afc` | `oklch(60.51% 0.2105 259.65)` | Clear Blue | black, 5.2 to 1 |
| 17 | `#3484ff` | `oklch(63.11% 0.1991 259.24)` | Dodger Blue | black, 5.8 to 1 |
| 18 | `#448eff` | `oklch(65.71% 0.1834 258.83)` | Bleuchâtel Blue | black, 6.5 to 1 |
| 19 | `#5398ff` | `oklch(68.30% 0.1681 258.42)` | Blue Chaos | black, 7.2 to 1 |
| 20 | `#61a1ff` | `oklch(70.87% 0.1531 258.01)` | Âbi Blue | black, 8 to 1 |
| 21 | `#6faaff` | `oklch(73.40% 0.1386 257.60)` | Fennel Flower | black, 8.8 to 1 |
| 22 | `#7db2ff` | `oklch(75.86% 0.1247 257.19)` | French Sky Blue | black, 9.7 to 1 |
| 23 | `#89bbff` | `oklch(78.25% 0.1115 256.78)` | Scenic Water | black, 10.5 to 1 |
| 24 | `#96c2ff` | `oklch(80.55% 0.0990 256.37)` | Pastel Blue | black, 11.4 to 1 |
| 25 | `#a2c9ff` | `oklch(82.78% 0.0870 255.95)` | Apocyan | black, 12.3 to 1 |
| 26 | `#aed1ff` | `oklch(85.07% 0.0749 255.49)` | Ice Cold Stare | black, 13.3 to 1 |
| 27 | `#bad8ff` | `oklch(87.34% 0.0631 255.01)` | Oh Boy! | black, 14.3 to 1 |
| 28 | `#c6dfff` | `oklch(89.52% 0.0518 254.54)` | Arc Light | black, 15.3 to 1 |
| 29 | `#d1e5ff` | `oklch(91.56% 0.0415 254.09)` | Veiling Waterfalls | black, 16.3 to 1 |
| 30 | `#dbebff` | `oklch(93.37% 0.0324 253.68)` | Hoarfrost | black, 17.3 to 1 |
| 31 | `#e3f0ff` | `oklch(94.90% 0.0249 253.34)` | Wizard White | black, 18.1 to 1 |
| 32 | `#e9f3ff` | `oklch(96.06% 0.0191 253.08)` | Moon White | black, 18.7 to 1 |

## CSS

```css
background: radial-gradient(circle at 50% 50%, #09183b 0.0%, #0a1b42 3.2%, #0b1f4c 6.5%, #0d2459 9.7%, #0e2967 12.9%, #102f76 16.1%, #123686 19.4%, #143c95 22.6%, #1643a2 25.8%, #174ab0 29.0%, #1851be 32.3%, #1958cc 35.5%, #1a60da 38.7%, #1c68e7 41.9%, #2071f3 45.2%, #267afc 48.4%, #3484ff 51.6%, #448eff 54.8%, #5398ff 58.1%, #61a1ff 61.3%, #6faaff 64.5%, #7db2ff 67.7%, #89bbff 71.0%, #96c2ff 74.2%, #a2c9ff 77.4%, #aed1ff 80.6%, #bad8ff 83.9%, #c6dfff 87.1%, #d1e5ff 90.3%, #dbebff 93.5%, #e3f0ff 96.8%, #e9f3ff 100.0%);
background: radial-gradient(circle at 50% 50% in oklch, oklch(22.05% 0.0703 263.67) 0.0%, oklch(23.55% 0.0777 263.60) 3.2%, oklch(25.53% 0.0880 263.53) 6.5%, oklch(27.90% 0.1003 263.44) 9.7%, oklch(30.53% 0.1137 263.33) 12.9%, oklch(33.33% 0.1274 263.19) 16.1%, oklch(36.17% 0.1406 263.02) 19.4%, oklch(38.96% 0.1524 262.81) 22.6%, oklch(41.59% 0.1621 262.54) 25.8%, oklch(44.22% 0.1717 262.22) 29.0%, oklch(46.91% 0.1816 261.85) 32.3%, oklch(49.64% 0.1911 261.44) 35.5%, oklch(52.38% 0.1994 260.99) 38.7%, oklch(55.13% 0.2059 260.54) 41.9%, oklch(57.84% 0.2098 260.09) 45.2%, oklch(60.51% 0.2105 259.65) 48.4%, oklch(63.11% 0.1991 259.24) 51.6%, oklch(65.71% 0.1834 258.83) 54.8%, oklch(68.30% 0.1681 258.42) 58.1%, oklch(70.87% 0.1531 258.01) 61.3%, oklch(73.40% 0.1386 257.60) 64.5%, oklch(75.86% 0.1247 257.19) 67.7%, oklch(78.25% 0.1115 256.78) 71.0%, oklch(80.55% 0.0990 256.37) 74.2%, oklch(82.78% 0.0870 255.95) 77.4%, oklch(85.07% 0.0749 255.49) 80.6%, oklch(87.34% 0.0631 255.01) 83.9%, oklch(89.52% 0.0518 254.54) 87.1%, oklch(91.56% 0.0415 254.09) 90.3%, oklch(93.37% 0.0324 253.68) 93.5%, oklch(94.90% 0.0249 253.34) 96.8%, oklch(96.06% 0.0191 253.08) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.22 | 0.07 | 263.7 |
| 2 | 0.409 | 0.16 | 262.6 |
| 3 | 0.618 | 0.209 | 259.4 |
| 4 | 0.811 | 0.11 | 256.3 |
| 5 | 0.961 | 0.021 | 253.1 |

## In these collections

- [Electric blue gradients](https://grabient.com/electric-blue-gradients)
- [Cool blue](https://grabient.com/cool-blue)
- [Sequential data gradients](https://grabient.com/sequential-data-gradients)
- [Three color gradients](https://grabient.com/three-color-gradients)

## Other forms

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