# Analogous dark blue to purple radial gradient

Analogous dark blue to purple radial gradient with 32 colors: #270f63, #291066, #2b106b, #2e1170, #311276, #34137d, #381483, #3c1689, #3f178e, #431894, #471a99, #4c1b9e, #501ca3, #551ea8, #5a20ac, #5f22b0, #6425b3, #6828b5, #6d2bb7, #722eb9, #7731ba, #7c34ba, #8238ba, #883cb9, #9040b7, #9945b3, #a34aae, #ab50a8, #b356a3, #ba5c9e, #be619b, #c16598. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kWRWHMLL_ALfKQNCRcGUDBEQ`
- Page: https://grabient.com/kWRWHMLL_ALfKQNCRcGUDBEQ?style=radialGradient&steps=32
- Drawn as: radial gradient, 32 steps, 90 degrees
- Kinds: dark to light, vivid
- Hues: analogous
- Contrast of its darkest and lightest colors: 4.1 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 | `#270f63` | `oklch(27.17% 0.1337 286.88)` | Nebula Night | white, 15.7 to 1 |
| 2 | `#291066` | `oklch(27.79% 0.1371 287.01)` | Nebula Night | white, 15.4 to 1 |
| 3 | `#2b106b` | `oklch(28.62% 0.1417 287.14)` | Nebula Night | white, 15 to 1 |
| 4 | `#2e1170` | `oklch(29.60% 0.1472 287.30)` | Nebula Night | white, 14.6 to 1 |
| 5 | `#311276` | `oklch(30.70% 0.1533 287.50)` | Persian Indigo | white, 14.1 to 1 |
| 6 | `#34137d` | `oklch(31.87% 0.1596 287.76)` | Persian Indigo | white, 13.6 to 1 |
| 7 | `#381483` | `oklch(33.05% 0.1657 288.11)` | Pixie Powder | white, 13.1 to 1 |
| 8 | `#3c1689` | `oklch(34.21% 0.1713 288.57)` | Pixie Powder | white, 12.6 to 1 |
| 9 | `#3f178e` | `oklch(35.31% 0.1761 289.14)` | Grim Purple | white, 12.1 to 1 |
| 10 | `#431894` | `oklch(36.40% 0.1808 289.81)` | Space Battle Blue | white, 11.6 to 1 |
| 11 | `#471a99` | `oklch(37.51% 0.1855 290.56)` | Space Battle Blue | white, 11.2 to 1 |
| 12 | `#4c1b9e` | `oklch(38.64% 0.1901 291.39)` | Amarklor Violet | white, 10.7 to 1 |
| 13 | `#501ca3` | `oklch(39.77% 0.1944 292.32)` | Eine Kleine Nachtmusik | white, 10.2 to 1 |
| 14 | `#551ea8` | `oklch(40.91% 0.1981 293.34)` | Aubergine Perl | white, 9.8 to 1 |
| 15 | `#5a20ac` | `oklch(42.04% 0.2011 294.48)` | Royalty | white, 9.3 to 1 |
| 16 | `#5f22b0` | `oklch(43.15% 0.2033 295.72)` | Rabbit-Ear Iris | white, 8.9 to 1 |
| 17 | `#6425b3` | `oklch(44.24% 0.2044 297.05)` | Rabbit-Ear Iris | white, 8.5 to 1 |
| 18 | `#6828b5` | `oklch(45.28% 0.2048 298.29)` | Rabbit-Ear Iris | white, 8.1 to 1 |
| 19 | `#6d2bb7` | `oklch(46.30% 0.2046 299.53)` | Purple Emperor | white, 7.8 to 1 |
| 20 | `#722eb9` | `oklch(47.31% 0.2038 300.86)` | Purple Emperor | white, 7.5 to 1 |
| 21 | `#7731ba` | `oklch(48.33% 0.2022 302.40)` | Purple Pristine | white, 7.1 to 1 |
| 22 | `#7c34ba` | `oklch(49.38% 0.1998 304.25)` | Purple Pristine | white, 6.8 to 1 |
| 23 | `#8238ba` | `oklch(50.48% 0.1966 306.52)` | Pleasant Purple | white, 6.5 to 1 |
| 24 | `#883cb9` | `oklch(51.66% 0.1927 309.33)` | Harley Hair Purple | white, 6.1 to 1 |
| 25 | `#9040b7` | `oklch(52.97% 0.1874 312.94)` | Akebi Purple | white, 5.8 to 1 |
| 26 | `#9945b3` | `oklch(54.49% 0.1802 317.63)` | Tyrian Shimmer | white, 5.4 to 1 |
| 27 | `#a34aae` | `oklch(56.12% 0.1716 323.03)` | Fuchsia Pheromone | white, 5 to 1 |
| 28 | `#ab50a8` | `oklch(57.79% 0.1623 328.76)` | Orchid Dottyback | white, 4.7 to 1 |
| 29 | `#b356a3` | `oklch(59.40% 0.1531 334.41)` | Magenta Memoir | black, 4.7 to 1 |
| 30 | `#ba5c9e` | `oklch(60.86% 0.1445 339.62)` | Spring Crocus | black, 5.1 to 1 |
| 31 | `#be619b` | `oklch(62.09% 0.1374 343.98)` | Spring Crocus | black, 5.3 to 1 |
| 32 | `#c16598` | `oklch(62.99% 0.1323 347.11)` | Ibis Rose | black, 5.6 to 1 |

## CSS

```css
background: radial-gradient(circle at 50% 50%, #270f63 0.0%, #291066 3.2%, #2b106b 6.5%, #2e1170 9.7%, #311276 12.9%, #34137d 16.1%, #381483 19.4%, #3c1689 22.6%, #3f178e 25.8%, #431894 29.0%, #471a99 32.3%, #4c1b9e 35.5%, #501ca3 38.7%, #551ea8 41.9%, #5a20ac 45.2%, #5f22b0 48.4%, #6425b3 51.6%, #6828b5 54.8%, #6d2bb7 58.1%, #722eb9 61.3%, #7731ba 64.5%, #7c34ba 67.7%, #8238ba 71.0%, #883cb9 74.2%, #9040b7 77.4%, #9945b3 80.6%, #a34aae 83.9%, #ab50a8 87.1%, #b356a3 90.3%, #ba5c9e 93.5%, #be619b 96.8%, #c16598 100.0%);
background: radial-gradient(circle at 50% 50% in oklch, oklch(27.17% 0.1337 286.88) 0.0%, oklch(27.79% 0.1371 287.01) 3.2%, oklch(28.62% 0.1417 287.14) 6.5%, oklch(29.60% 0.1472 287.30) 9.7%, oklch(30.70% 0.1533 287.50) 12.9%, oklch(31.87% 0.1596 287.76) 16.1%, oklch(33.05% 0.1657 288.11) 19.4%, oklch(34.21% 0.1713 288.57) 22.6%, oklch(35.31% 0.1761 289.14) 25.8%, oklch(36.40% 0.1808 289.81) 29.0%, oklch(37.51% 0.1855 290.56) 32.3%, oklch(38.64% 0.1901 291.39) 35.5%, oklch(39.77% 0.1944 292.32) 38.7%, oklch(40.91% 0.1981 293.34) 41.9%, oklch(42.04% 0.2011 294.48) 45.2%, oklch(43.15% 0.2033 295.72) 48.4%, oklch(44.24% 0.2044 297.05) 51.6%, oklch(45.28% 0.2048 298.29) 54.8%, oklch(46.30% 0.2046 299.53) 58.1%, oklch(47.31% 0.2038 300.86) 61.3%, oklch(48.33% 0.2022 302.40) 64.5%, oklch(49.38% 0.1998 304.25) 67.7%, oklch(50.48% 0.1966 306.52) 71.0%, oklch(51.66% 0.1927 309.33) 74.2%, oklch(52.97% 0.1874 312.94) 77.4%, oklch(54.49% 0.1802 317.63) 80.6%, oklch(56.12% 0.1716 323.03) 83.9%, oklch(57.79% 0.1623 328.76) 87.1%, oklch(59.40% 0.1531 334.41) 90.3%, oklch(60.86% 0.1445 339.62) 93.5%, oklch(62.09% 0.1374 343.98) 96.8%, oklch(62.99% 0.1323 347.11) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.272 | 0.134 | 286.9 |
| 2 | 0.35 | 0.175 | 289 |
| 3 | 0.437 | 0.204 | 296.4 |
| 4 | 0.52 | 0.192 | 310.1 |
| 5 | 0.63 | 0.132 | 347.1 |

## In these collections

- [Three color gradients](https://grabient.com/three-color-gradients)
- [Purple and pink gradients](https://grabient.com/purple-and-pink-gradients)

## Other forms

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