# Indigo, magenta and rose neon palette

The Indigo, magenta and rose neon palette brings together blue and magenta. The colors span a narrow lightness range, combining strong color with gentle contrast. Its balanced and composed character suits game interface concepts and stream graphics. Its darkest tone is blue, and its lightest tone is magenta.

- Also called: Vivid analogous purple to pink angular gradient
- Seed: `kSk6fK0dBEtbMQ2`
- Page: https://grabient.com/kSk6fK0dBEtbMQ2?style=angularGradient&steps=32&angle=315
- Drawn as: angular gradient, 32 steps, 315 degrees
- Kinds: even lightness, vivid
- Hues: analogous
- Contrast of its darkest and lightest colors: 1.4 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 | `#7356f9` | `oklch(57.87% 0.2301 284.77)` | Venetian Nights | white, 4.7 to 1 |
| 2 | `#7756f8` | `oklch(58.11% 0.2298 286.24)` | Venetian Nights | white, 4.6 to 1 |
| 3 | `#7c55f8` | `oklch(58.40% 0.2294 288.06)` | Venetian Nights | white, 4.6 to 1 |
| 4 | `#8155f7` | `oklch(58.73% 0.2289 290.17)` | Purple Honeycreeper | white, 4.5 to 1 |
| 5 | `#8754f6` | `oklch(59.11% 0.2283 292.54)` | Purple Honeycreeper | black, 4.6 to 1 |
| 6 | `#8e54f4` | `oklch(59.52% 0.2278 295.12)` | Pericallis Hybrida | black, 4.7 to 1 |
| 7 | `#9453f3` | `oklch(59.96% 0.2271 297.88)` | Pericallis Hybrida | black, 4.7 to 1 |
| 8 | `#9b52f0` | `oklch(60.42% 0.2265 300.76)` | Aconite Violet | black, 4.8 to 1 |
| 9 | `#a152ee` | `oklch(60.90% 0.2258 303.75)` | Aconite Violet | black, 4.9 to 1 |
| 10 | `#a851eb` | `oklch(61.38% 0.2251 306.78)` | Lightish Purple | black, 5 to 1 |
| 11 | `#ae51e8` | `oklch(61.86% 0.2244 309.82)` | Light Shōtoku Purple | black, 5.1 to 1 |
| 12 | `#b450e5` | `oklch(62.33% 0.2237 312.84)` | Light Shōtoku Purple | black, 5.2 to 1 |
| 13 | `#ba50e1` | `oklch(62.79% 0.2229 315.78)` | Ultraviolet Onsible | black, 5.3 to 1 |
| 14 | `#c04fdd` | `oklch(63.22% 0.2222 318.61)` | Medium Orchid | black, 5.4 to 1 |
| 15 | `#c54fda` | `oklch(63.63% 0.2215 321.28)` | Thick Pink | black, 5.4 to 1 |
| 16 | `#c94fd6` | `oklch(64.00% 0.2208 323.77)` | Thick Pink | black, 5.5 to 1 |
| 17 | `#cd4fd3` | `oklch(64.34% 0.2201 326.05)` | Thick Pink | black, 5.6 to 1 |
| 18 | `#d14fcf` | `oklch(64.66% 0.2194 328.33)` | Pinkish Purple | black, 5.7 to 1 |
| 19 | `#d54fcc` | `oklch(64.99% 0.2187 330.62)` | Purplish Pink | black, 5.7 to 1 |
| 20 | `#d84fc8` | `oklch(65.30% 0.2179 332.90)` | Purplish Pink | black, 5.8 to 1 |
| 21 | `#dc4fc4` | `oklch(65.61% 0.2170 335.17)` | Purplish Pink | black, 5.9 to 1 |
| 22 | `#df4fc0` | `oklch(65.90% 0.2162 337.40)` | Purplish Pink | black, 6 to 1 |
| 23 | `#e24fbc` | `oklch(66.19% 0.2154 339.59)` | Purplish Pink | black, 6 to 1 |
| 24 | `#e54fb8` | `oklch(66.47% 0.2146 341.71)` | Purplish Pink | black, 6.1 to 1 |
| 25 | `#e84fb5` | `oklch(66.73% 0.2138 343.75)` | Orion | black, 6.2 to 1 |
| 26 | `#ea50b1` | `oklch(66.98% 0.2130 345.69)` | Major Magenta | black, 6.2 to 1 |
| 27 | `#ed50ae` | `oklch(67.21% 0.2122 347.53)` | Major Magenta | black, 6.3 to 1 |
| 28 | `#ef51aa` | `oklch(67.43% 0.2115 349.24)` | Major Magenta | black, 6.4 to 1 |
| 29 | `#f051a7` | `oklch(67.63% 0.2109 350.81)` | Major Magenta | black, 6.4 to 1 |
| 30 | `#f251a5` | `oklch(67.81% 0.2103 352.22)` | Major Magenta | black, 6.5 to 1 |
| 31 | `#f352a2` | `oklch(67.97% 0.2099 353.46)` | Pinkella | black, 6.5 to 1 |
| 32 | `#f452a0` | `oklch(68.11% 0.2094 354.51)` | Pansy | black, 6.5 to 1 |

## CSS

```css
background: conic-gradient(from 315deg, #7356f9 0.0%, #7756f8 3.2%, #7c55f8 6.5%, #8155f7 9.7%, #8754f6 12.9%, #8e54f4 16.1%, #9453f3 19.4%, #9b52f0 22.6%, #a152ee 25.8%, #a851eb 29.0%, #ae51e8 32.3%, #b450e5 35.5%, #ba50e1 38.7%, #c04fdd 41.9%, #c54fda 45.2%, #c94fd6 48.4%, #cd4fd3 51.6%, #d14fcf 54.8%, #d54fcc 58.1%, #d84fc8 61.3%, #dc4fc4 64.5%, #df4fc0 67.7%, #e24fbc 71.0%, #e54fb8 74.2%, #e84fb5 77.4%, #ea50b1 80.6%, #ed50ae 83.9%, #ef51aa 87.1%, #f051a7 90.3%, #f251a5 93.5%, #f352a2 96.8%, #f452a0 100.0%);
background: conic-gradient(from 315deg in oklch, oklch(57.87% 0.2301 284.77) 0.0%, oklch(58.11% 0.2298 286.24) 3.2%, oklch(58.40% 0.2294 288.06) 6.5%, oklch(58.73% 0.2289 290.17) 9.7%, oklch(59.11% 0.2283 292.54) 12.9%, oklch(59.52% 0.2278 295.12) 16.1%, oklch(59.96% 0.2271 297.88) 19.4%, oklch(60.42% 0.2265 300.76) 22.6%, oklch(60.90% 0.2258 303.75) 25.8%, oklch(61.38% 0.2251 306.78) 29.0%, oklch(61.86% 0.2244 309.82) 32.3%, oklch(62.33% 0.2237 312.84) 35.5%, oklch(62.79% 0.2229 315.78) 38.7%, oklch(63.22% 0.2222 318.61) 41.9%, oklch(63.63% 0.2215 321.28) 45.2%, oklch(64.00% 0.2208 323.77) 48.4%, oklch(64.34% 0.2201 326.05) 51.6%, oklch(64.66% 0.2194 328.33) 54.8%, oklch(64.99% 0.2187 330.62) 58.1%, oklch(65.30% 0.2179 332.90) 61.3%, oklch(65.61% 0.2170 335.17) 64.5%, oklch(65.90% 0.2162 337.40) 67.7%, oklch(66.19% 0.2154 339.59) 71.0%, oklch(66.47% 0.2146 341.71) 74.2%, oklch(66.73% 0.2138 343.75) 77.4%, oklch(66.98% 0.2130 345.69) 80.6%, oklch(67.21% 0.2122 347.53) 83.9%, oklch(67.43% 0.2115 349.24) 87.1%, oklch(67.63% 0.2109 350.81) 90.3%, oklch(67.81% 0.2103 352.22) 93.5%, oklch(67.97% 0.2099 353.46) 96.8%, oklch(68.11% 0.2094 354.51) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.579 | 0.23 | 284.8 |
| 2 | 0.642 | 0.22 | 324.9 |
| 3 | 0.681 | 0.209 | 354.5 |

## In these collections

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

## Other forms

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