# Navy, purple, blue and light blue radial gradient

Navy, purple, blue and light blue radial gradient with 32 colors: #011529, #081e38, #182c4d, #2e3c68, #494d85, #655da0, #7f6bb7, #9275c8, #9b79d0, #9577d0, #8471c9, #6d68bc, #535dab, #39539a, #234a8c, #124684, #0e4686, #1b4991, #2f4fa2, #4756b5, #615dca, #7c66dc, #926eea, #a278f6, #a883ff, #a692ff, #a3a0ff, #9fadff, #9cb8ff, #99c1ff, #98c8ff, #9ccdfc. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kWMSSxUa9GDIrOpWQkTaZ66I`
- Page: https://grabient.com/kWMSSxUa9GDIrOpWQkTaZ66I?style=radialGradient&steps=32&angle=0
- Drawn as: radial gradient, 32 steps, 0 degrees
- Kinds: cool
- Hues: analogous
- Contrast of its darkest and lightest colors: 10.9 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 | `#011529` | `oklch(19.29% 0.0496 248.91)` | Creeping Death | white, 18.3 to 1 |
| 2 | `#081e38` | `oklch(23.39% 0.0567 253.76)` | Naval Night | white, 16.7 to 1 |
| 3 | `#182c4d` | `oklch(29.41% 0.0668 260.99)` | Midnight Ocean | white, 13.9 to 1 |
| 4 | `#2e3c68` | `oklch(36.60% 0.0789 269.65)` | Newport Indigo | white, 10.7 to 1 |
| 5 | `#494d85` | `oklch(44.24% 0.0919 278.77)` | Altar of Heaven | white, 7.8 to 1 |
| 6 | `#655da0` | `oklch(51.57% 0.1046 287.39)` | Giant Onion | white, 5.7 to 1 |
| 7 | `#7f6bb7` | `oklch(57.87% 0.1161 294.55)` | Lavish Spending | black, 4.6 to 1 |
| 8 | `#9275c8` | `oklch(62.39% 0.1250 299.29)` | True V | black, 5.5 to 1 |
| 9 | `#9b79d0` | `oklch(64.40% 0.1305 300.65)` | Lilac Bush | black, 6 to 1 |
| 10 | `#9577d0` | `oklch(63.55% 0.1321 297.93)` | True V | black, 5.8 to 1 |
| 11 | `#8471c9` | `oklch(60.48% 0.1308 292.01)` | True V | black, 5.1 to 1 |
| 12 | `#6d68bc` | `oklch(55.98% 0.1275 284.08)` | Ultra Violet | white, 4.8 to 1 |
| 13 | `#535dab` | `oklch(50.86% 0.1235 275.32)` | Yuè Guāng Lán Moonlight | white, 5.9 to 1 |
| 14 | `#39539a` | `oklch(45.89% 0.1198 266.92)` | Muted Lavender | white, 7.3 to 1 |
| 15 | `#234a8c` | `oklch(41.88% 0.1173 260.06)` | Pacific Navy | white, 8.6 to 1 |
| 16 | `#124684` | `oklch(39.61% 0.1173 255.92)` | Poster Blue | white, 9.4 to 1 |
| 17 | `#0e4686` | `oklch(39.72% 0.1208 255.63)` | Poster Blue | white, 9.4 to 1 |
| 18 | `#1b4991` | `oklch(41.71% 0.1285 259.13)` | Nuit Blanche | white, 8.7 to 1 |
| 19 | `#2f4fa2` | `oklch(45.04% 0.1391 265.29)` | Dazzling Blue | white, 7.6 to 1 |
| 20 | `#4756b5` | `oklch(49.29% 0.1511 273.00)` | Chinese Bellflower | white, 6.4 to 1 |
| 21 | `#615dca` | `oklch(54.03% 0.1629 281.10)` | Dark Periwinkle | white, 5.3 to 1 |
| 22 | `#7c66dc` | `oklch(58.85% 0.1730 288.47)` | Medium Slate Blue | black, 4.7 to 1 |
| 23 | `#926eea` | `oklch(63.30% 0.1800 293.96)` | Matt Purple | black, 5.6 to 1 |
| 24 | `#a278f6` | `oklch(66.97% 0.1822 296.44)` | Purple Illusionist | black, 6.5 to 1 |
| 25 | `#a883ff` | `oklch(69.78% 0.1783 295.10)` | Purple Illusionist | black, 7.3 to 1 |
| 26 | `#a692ff` | `oklch(72.37% 0.1553 290.60)` | Cobalite | black, 8.1 to 1 |
| 27 | `#a3a0ff` | `oklch(74.75% 0.1346 283.87)` | Cobalite | black, 9 to 1 |
| 28 | `#9fadff` | `oklch(76.91% 0.1183 275.79)` | Widowmaker | black, 9.9 to 1 |
| 29 | `#9cb8ff` | `oklch(78.84% 0.1064 267.25)` | Truesky Gloxym | black, 10.7 to 1 |
| 30 | `#99c1ff` | `oklch(80.52% 0.0983 259.16)` | Pastel Blue | black, 11.4 to 1 |
| 31 | `#98c8ff` | `oklch(81.93% 0.0929 252.39)` | Apocyan | black, 12 to 1 |
| 32 | `#9ccdfc` | `oklch(83.07% 0.0841 247.85)` | Apocyan | black, 12.5 to 1 |

## CSS

```css
background: radial-gradient(circle at 50% 50%, #011529 0.0%, #081e38 3.2%, #182c4d 6.5%, #2e3c68 9.7%, #494d85 12.9%, #655da0 16.1%, #7f6bb7 19.4%, #9275c8 22.6%, #9b79d0 25.8%, #9577d0 29.0%, #8471c9 32.3%, #6d68bc 35.5%, #535dab 38.7%, #39539a 41.9%, #234a8c 45.2%, #124684 48.4%, #0e4686 51.6%, #1b4991 54.8%, #2f4fa2 58.1%, #4756b5 61.3%, #615dca 64.5%, #7c66dc 67.7%, #926eea 71.0%, #a278f6 74.2%, #a883ff 77.4%, #a692ff 80.6%, #a3a0ff 83.9%, #9fadff 87.1%, #9cb8ff 90.3%, #99c1ff 93.5%, #98c8ff 96.8%, #9ccdfc 100.0%);
background: radial-gradient(circle at 50% 50% in oklch, oklch(19.29% 0.0496 248.91) 0.0%, oklch(23.39% 0.0567 253.76) 3.2%, oklch(29.41% 0.0668 260.99) 6.5%, oklch(36.60% 0.0789 269.65) 9.7%, oklch(44.24% 0.0919 278.77) 12.9%, oklch(51.57% 0.1046 287.39) 16.1%, oklch(57.87% 0.1161 294.55) 19.4%, oklch(62.39% 0.1250 299.29) 22.6%, oklch(64.40% 0.1305 300.65) 25.8%, oklch(63.55% 0.1321 297.93) 29.0%, oklch(60.48% 0.1308 292.01) 32.3%, oklch(55.98% 0.1275 284.08) 35.5%, oklch(50.86% 0.1235 275.32) 38.7%, oklch(45.89% 0.1198 266.92) 41.9%, oklch(41.88% 0.1173 260.06) 45.2%, oklch(39.61% 0.1173 255.92) 48.4%, oklch(39.72% 0.1208 255.63) 51.6%, oklch(41.71% 0.1285 259.13) 54.8%, oklch(45.04% 0.1391 265.29) 58.1%, oklch(49.29% 0.1511 273.00) 61.3%, oklch(54.03% 0.1629 281.10) 64.5%, oklch(58.85% 0.1730 288.47) 67.7%, oklch(63.30% 0.1800 293.96) 71.0%, oklch(66.97% 0.1822 296.44) 74.2%, oklch(69.78% 0.1783 295.10) 77.4%, oklch(72.37% 0.1553 290.60) 80.6%, oklch(74.75% 0.1346 283.87) 83.9%, oklch(76.91% 0.1183 275.79) 87.1%, oklch(78.84% 0.1064 267.25) 90.3%, oklch(80.52% 0.0983 259.16) 93.5%, oklch(81.93% 0.0929 252.39) 96.8%, oklch(83.07% 0.0841 247.85) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.193 | 0.05 | 248.9 |
| 2 | 0.642 | 0.13 | 300.7 |
| 3 | 0.394 | 0.119 | 255.2 |
| 4 | 0.677 | 0.182 | 296.5 |
| 5 | 0.831 | 0.084 | 247.8 |

## In these collections

- [Blue and purple gradients](https://grabient.com/blue-and-purple-gradients)

## Other forms

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