# Lilac color palette

The Lilac color palette brings together light magenta, purple, and dark purple. The colors span a broad lightness range, combining strong color with clear contrast. Its bold and dramatic character suits game interface concepts and stream graphics. Its darkest tone is dark purple, and its lightest tone is light magenta.

- Also called: Vivid analogous pink, purple and navy radial gradient
- Seed: `kYz3DkWF8_0tlP07Vj8KsA-h0svm`
- Page: https://grabient.com/kYz3DkWF8_0tlP07Vj8KsA-h0svm?style=radialGradient&steps=32&angle=180
- Drawn as: radial gradient, 32 steps, 180 degrees
- Kinds: light to dark, vivid
- Hues: analogous
- Contrast of its darkest and lightest colors: 9.3 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 | `#efa0ff` | `oklch(81.50% 0.1537 320.63)` | VIC 20 Pink | black, 11.1 to 1 |
| 2 | `#ed99ff` | `oklch(80.20% 0.1652 320.56)` | Party Pig | black, 10.5 to 1 |
| 3 | `#eb8eff` | `oklch(78.39% 0.1815 320.51)` | Give Me Your Love | black, 9.8 to 1 |
| 4 | `#e981ff` | `oklch(76.26% 0.2010 320.44)` | Pinkling | black, 9 to 1 |
| 5 | `#e672ff` | `oklch(73.97% 0.2220 320.30)` | Venus Slipper Orchid | black, 8.2 to 1 |
| 6 | `#e362ff` | `oklch(71.71% 0.2423 320.06)` | Hitsujiyama Pink | black, 7.4 to 1 |
| 7 | `#df53ff` | `oklch(69.66% 0.2597 319.67)` | Flaming Flamingo | black, 6.8 to 1 |
| 8 | `#da48fd` | `oklch(67.89% 0.2688 319.11)` | Geisha Pink | black, 6.3 to 1 |
| 9 | `#d53efb` | `oklch(66.25% 0.2750 318.41)` | Epink | black, 5.9 to 1 |
| 10 | `#cf36f9` | `oklch(64.67% 0.2787 317.59)` | Flamingo Queen | black, 5.5 to 1 |
| 11 | `#c82ef6` | `oklch(63.10% 0.2803 316.68)` | Flamingo Queen | black, 5.1 to 1 |
| 12 | `#c127f2` | `oklch(61.49% 0.2803 315.70)` | Promiscuous Pink | black, 4.8 to 1 |
| 13 | `#ba20ee` | `oklch(59.78% 0.2791 314.69)` | Promiscuous Pink | white, 4.6 to 1 |
| 14 | `#b218e9` | `oklch(57.93% 0.2767 313.67)` | Vivid Mulberry | white, 5 to 1 |
| 15 | `#a911e2` | `oklch(55.98% 0.2723 312.63)` | Vibrant Purple | white, 5.4 to 1 |
| 16 | `#9f0bdb` | `oklch(53.96% 0.2661 311.55)` | Prom Queen | white, 5.9 to 1 |
| 17 | `#9607d3` | `oklch(51.89% 0.2587 310.40)` | Violet Ink | white, 6.4 to 1 |
| 18 | `#8c05ca` | `oklch(49.79% 0.2505 309.15)` | French Violet | white, 7 to 1 |
| 19 | `#8204c2` | `oklch(47.70% 0.2420 307.78)` | Violet Poison | white, 7.6 to 1 |
| 20 | `#7903b9` | `oklch(45.63% 0.2336 306.26)` | Violet Poison | white, 8.3 to 1 |
| 21 | `#6f03b1` | `oklch(43.50% 0.2245 304.57)` | Indiviolet Sunset | white, 9 to 1 |
| 22 | `#6504a8` | `oklch(41.35% 0.2146 302.74)` | Indiviolet Sunset | white, 9.8 to 1 |
| 23 | `#5b059e` | `oklch(39.19% 0.2044 300.82)` | Amarklor Violet | white, 10.6 to 1 |
| 24 | `#520695` | `oklch(37.08% 0.1941 298.84)` | Amarklor Violet | white, 11.5 to 1 |
| 25 | `#49078c` | `oklch(35.03% 0.1840 296.85)` | Pitch Violet | white, 12.4 to 1 |
| 26 | `#410783` | `oklch(33.08% 0.1745 294.86)` | Grim Purple | white, 13.2 to 1 |
| 27 | `#39087a` | `oklch(31.10% 0.1647 292.68)` | Marionberry | white, 14.1 to 1 |
| 28 | `#310870` | `oklch(29.09% 0.1546 290.33)` | Galactic Federation | white, 15 to 1 |
| 29 | `#290867` | `oklch(27.15% 0.1448 287.96)` | Nebula Night | white, 15.8 to 1 |
| 30 | `#23075f` | `oklch(25.39% 0.1358 285.77)` | Blackmail | white, 16.5 to 1 |
| 31 | `#1e0758` | `oklch(23.92% 0.1282 283.92)` | Indigo Sloth | white, 17.1 to 1 |
| 32 | `#1a0752` | `oklch(22.83% 0.1226 282.58)` | Indigo Sloth | white, 17.5 to 1 |

## CSS

```css
background: radial-gradient(circle at 50% 50%, #efa0ff 0.0%, #ed99ff 3.2%, #eb8eff 6.5%, #e981ff 9.7%, #e672ff 12.9%, #e362ff 16.1%, #df53ff 19.4%, #da48fd 22.6%, #d53efb 25.8%, #cf36f9 29.0%, #c82ef6 32.3%, #c127f2 35.5%, #ba20ee 38.7%, #b218e9 41.9%, #a911e2 45.2%, #9f0bdb 48.4%, #9607d3 51.6%, #8c05ca 54.8%, #8204c2 58.1%, #7903b9 61.3%, #6f03b1 64.5%, #6504a8 67.7%, #5b059e 71.0%, #520695 74.2%, #49078c 77.4%, #410783 80.6%, #39087a 83.9%, #310870 87.1%, #290867 90.3%, #23075f 93.5%, #1e0758 96.8%, #1a0752 100.0%);
background: radial-gradient(circle at 50% 50% in oklch, oklch(81.50% 0.1537 320.63) 0.0%, oklch(80.20% 0.1652 320.56) 3.2%, oklch(78.39% 0.1815 320.51) 6.5%, oklch(76.26% 0.2010 320.44) 9.7%, oklch(73.97% 0.2220 320.30) 12.9%, oklch(71.71% 0.2423 320.06) 16.1%, oklch(69.66% 0.2597 319.67) 19.4%, oklch(67.89% 0.2688 319.11) 22.6%, oklch(66.25% 0.2750 318.41) 25.8%, oklch(64.67% 0.2787 317.59) 29.0%, oklch(63.10% 0.2803 316.68) 32.3%, oklch(61.49% 0.2803 315.70) 35.5%, oklch(59.78% 0.2791 314.69) 38.7%, oklch(57.93% 0.2767 313.67) 41.9%, oklch(55.98% 0.2723 312.63) 45.2%, oklch(53.96% 0.2661 311.55) 48.4%, oklch(51.89% 0.2587 310.40) 51.6%, oklch(49.79% 0.2505 309.15) 54.8%, oklch(47.70% 0.2420 307.78) 58.1%, oklch(45.63% 0.2336 306.26) 61.3%, oklch(43.50% 0.2245 304.57) 64.5%, oklch(41.35% 0.2146 302.74) 67.7%, oklch(39.19% 0.2044 300.82) 71.0%, oklch(37.08% 0.1941 298.84) 74.2%, oklch(35.03% 0.1840 296.85) 77.4%, oklch(33.08% 0.1745 294.86) 80.6%, oklch(31.10% 0.1647 292.68) 83.9%, oklch(29.09% 0.1546 290.33) 87.1%, oklch(27.15% 0.1448 287.96) 90.3%, oklch(25.39% 0.1358 285.77) 93.5%, oklch(23.92% 0.1282 283.92) 96.8%, oklch(22.83% 0.1226 282.58) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.815 | 0.154 | 320.6 |
| 2 | 0.693 | 0.262 | 319.6 |
| 3 | 0.591 | 0.278 | 314.3 |
| 4 | 0.465 | 0.237 | 306.9 |
| 5 | 0.335 | 0.176 | 295.3 |
| 6 | 0.228 | 0.123 | 282.6 |

## In these collections

- [Neon gradients](https://grabient.com/neon-gradients)
- [Synthwave gradients](https://grabient.com/synthwave-gradients)

## Other forms

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