# Midnight Mall Aura

From the center outward, the gradient begins in soft black, passes through deep indigo, violet, and magenta, then reaches turquoise at the edge. The continuous transition leaves broad, usable areas for foreground type while preserving the complete approved color journey.

- Also called: Navy, purple, pink and light blue radial gradient
- Seed: `kWNjPIKKpBDs9QdXyEUbZ-sw`
- Page: https://grabient.com/kWNjPIKKpBDs9QdXyEUbZ-sw?style=radialGradient&steps=32&angle=0
- Drawn as: radial gradient, 32 steps, 0 degrees
- Kinds: dark to light
- Hues: wide
- Contrast of its darkest and lightest colors: 12.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 | `#151238` | `oklch(21.26% 0.0703 281.25)` | Spanish Roast | white, 17.8 to 1 |
| 2 | `#17143b` | `oklch(22.08% 0.0739 281.97)` | Lost in Sadness | white, 17.5 to 1 |
| 3 | `#1a1540` | `oklch(23.15% 0.0786 282.87)` | Prune Plum | white, 17.1 to 1 |
| 4 | `#1d1746` | `oklch(24.42% 0.0843 283.95)` | Prune Plum | white, 16.5 to 1 |
| 5 | `#21194d` | `oklch(25.85% 0.0906 285.18)` | Silent Orbit | white, 15.9 to 1 |
| 6 | `#261c54` | `oklch(27.40% 0.0973 286.53)` | Silent Orbit | white, 15.3 to 1 |
| 7 | `#2b1e5b` | `oklch(29.01% 0.1041 288.00)` | Cluedo Night | white, 14.5 to 1 |
| 8 | `#312062` | `oklch(30.66% 0.1109 289.55)` | Indie Go | white, 13.8 to 1 |
| 9 | `#362369` | `oklch(32.30% 0.1173 291.16)` | Dark Dreams | white, 13.1 to 1 |
| 10 | `#3c2571` | `oklch(33.93% 0.1240 292.66)` | Explorer of the Galaxies | white, 12.3 to 1 |
| 11 | `#422778` | `oklch(35.60% 0.1311 294.08)` | Clear Purple | white, 11.6 to 1 |
| 12 | `#492a80` | `oklch(37.32% 0.1383 295.56)` | Spanish Violet | white, 10.9 to 1 |
| 13 | `#502c88` | `oklch(39.12% 0.1456 297.23)` | Sick Blue | white, 10.2 to 1 |
| 14 | `#582f8f` | `oklch(41.04% 0.1526 299.24)` | Night Fever | white, 9.4 to 1 |
| 15 | `#613197` | `oklch(43.08% 0.1593 301.72)` | Lucid Dreams | white, 8.7 to 1 |
| 16 | `#6c349e` | `oklch(45.29% 0.1653 304.80)` | Purple Heart | white, 7.9 to 1 |
| 17 | `#7938a4` | `oklch(47.69% 0.1710 309.03)` | Shiner | white, 7.2 to 1 |
| 18 | `#8a39a6` | `oklch(50.38% 0.1775 316.37)` | Pleasant Purple | white, 6.4 to 1 |
| 19 | `#9f3aa5` | `oklch(53.29% 0.1845 325.78)` | Medium Purple | white, 5.7 to 1 |
| 20 | `#b53c9f` | `oklch(56.34% 0.1912 335.78)` | Byzantine | white, 5 to 1 |
| 21 | `#ca3f99` | `oklch(59.45% 0.1969 344.86)` | Lustful Wishes | black, 4.6 to 1 |
| 22 | `#db4595` | `oklch(62.52% 0.2007 351.53)` | Prunus Avium | black, 5.2 to 1 |
| 23 | `#e84d98` | `oklch(65.48% 0.2018 354.28)` | Schiaparelli Pink | black, 5.9 to 1 |
| 24 | `#ef59a7` | `oklch(68.25% 0.1996 351.62)` | Fugitive Flamingo | black, 6.6 to 1 |
| 25 | `#ee68c3` | `oklch(70.85% 0.1928 341.70)` | Crumbly Lipstick | black, 7.3 to 1 |
| 26 | `#df7de8` | `oklch(73.50% 0.1806 324.11)` | Pink Bonnet | black, 8.2 to 1 |
| 27 | `#c29aff` | `oklch(76.13% 0.1461 301.14)` | Lilás | black, 9.3 to 1 |
| 28 | `#a5b4ff` | `oklch(78.66% 0.1084 275.15)` | Wondrous Wisteria | black, 10.5 to 1 |
| 29 | `#8dc7ff` | `oklch(81.01% 0.1001 248.50)` | Platonic Blue | black, 11.7 to 1 |
| 30 | `#6dd7fd` | `oklch(83.11% 0.1112 223.56)` | Heisenberg Blue | black, 12.8 to 1 |
| 31 | `#79e0e9` | `oklch(84.87% 0.0968 202.69)` | Turkish Turquoise | black, 13.6 to 1 |
| 32 | `#8be5dc` | `oklch(86.22% 0.0868 188.26)` | Sharbah Fizz | black, 14.3 to 1 |

## CSS

```css
background: radial-gradient(circle at 50% 50%, #151238 0.0%, #17143b 3.2%, #1a1540 6.5%, #1d1746 9.7%, #21194d 12.9%, #261c54 16.1%, #2b1e5b 19.4%, #312062 22.6%, #362369 25.8%, #3c2571 29.0%, #422778 32.3%, #492a80 35.5%, #502c88 38.7%, #582f8f 41.9%, #613197 45.2%, #6c349e 48.4%, #7938a4 51.6%, #8a39a6 54.8%, #9f3aa5 58.1%, #b53c9f 61.3%, #ca3f99 64.5%, #db4595 67.7%, #e84d98 71.0%, #ef59a7 74.2%, #ee68c3 77.4%, #df7de8 80.6%, #c29aff 83.9%, #a5b4ff 87.1%, #8dc7ff 90.3%, #6dd7fd 93.5%, #79e0e9 96.8%, #8be5dc 100.0%);
background: radial-gradient(circle at 50% 50% in oklch, oklch(21.26% 0.0703 281.25) 0.0%, oklch(22.08% 0.0739 281.97) 3.2%, oklch(23.15% 0.0786 282.87) 6.5%, oklch(24.42% 0.0843 283.95) 9.7%, oklch(25.85% 0.0906 285.18) 12.9%, oklch(27.40% 0.0973 286.53) 16.1%, oklch(29.01% 0.1041 288.00) 19.4%, oklch(30.66% 0.1109 289.55) 22.6%, oklch(32.30% 0.1173 291.16) 25.8%, oklch(33.93% 0.1240 292.66) 29.0%, oklch(35.60% 0.1311 294.08) 32.3%, oklch(37.32% 0.1383 295.56) 35.5%, oklch(39.12% 0.1456 297.23) 38.7%, oklch(41.04% 0.1526 299.24) 41.9%, oklch(43.08% 0.1593 301.72) 45.2%, oklch(45.29% 0.1653 304.80) 48.4%, oklch(47.69% 0.1710 309.03) 51.6%, oklch(50.38% 0.1775 316.37) 54.8%, oklch(53.29% 0.1845 325.78) 58.1%, oklch(56.34% 0.1912 335.78) 61.3%, oklch(59.45% 0.1969 344.86) 64.5%, oklch(62.52% 0.2007 351.53) 67.7%, oklch(65.48% 0.2018 354.28) 71.0%, oklch(68.25% 0.1996 351.62) 74.2%, oklch(70.85% 0.1928 341.70) 77.4%, oklch(73.50% 0.1806 324.11) 80.6%, oklch(76.13% 0.1461 301.14) 83.9%, oklch(78.66% 0.1084 275.15) 87.1%, oklch(81.01% 0.1001 248.50) 90.3%, oklch(83.11% 0.1112 223.56) 93.5%, oklch(84.87% 0.0968 202.69) 96.8%, oklch(86.22% 0.0868 188.26) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.213 | 0.07 | 281.3 |
| 2 | 0.319 | 0.116 | 290.8 |
| 3 | 0.465 | 0.168 | 306.6 |
| 4 | 0.689 | 0.198 | 349.9 |
| 5 | 0.862 | 0.087 | 188.3 |

## In these collections

- [Vaporwave color palette](https://grabient.com/vaporwave-color-palette)

## Other forms

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