# Violet orange and purple palette

The Violet orange and purple palette brings together purple, magenta, red, and orange. The colors span a moderate lightness range, combining strong color with gentle contrast. Its balanced and composed character suits brand mood boards and editorial graphics. Its darkest tone is purple, and its lightest tone is orange.

- Also called: Vivid purple, pink and orange linear gradient
- Seed: `kWdZjNQlBDM3MQzWyMPX8HDY`
- Page: https://grabient.com/kWdZjNQlBDM3MQzWyMPX8HDY?steps=32&angle=135
- Drawn as: linear gradient, 32 steps, 135 degrees
- Kinds: vivid
- Hues: wide
- Contrast of its darkest and lightest colors: 3.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 | `#5b31c3` | `oklch(46.06% 0.2094 288.28)` | Illustrious Indigo | white, 7.8 to 1 |
| 2 | `#6030c3` | `oklch(46.51% 0.2105 290.48)` | Purple Spot | white, 7.7 to 1 |
| 3 | `#662fc3` | `oklch(47.09% 0.2121 293.42)` | Purple Spot | white, 7.5 to 1 |
| 4 | `#6e2ec3` | `oklch(47.77% 0.2139 296.92)` | Sagat Purple | white, 7.3 to 1 |
| 5 | `#772cc3` | `oklch(48.55% 0.2159 300.80)` | Puissant Purple | white, 7.1 to 1 |
| 6 | `#7f2bc1` | `oklch(49.40% 0.2177 304.89)` | Pheromone Purple | white, 6.9 to 1 |
| 7 | `#882ac0` | `oklch(50.31% 0.2193 309.01)` | Pheromone Purple | white, 6.6 to 1 |
| 8 | `#9129bd` | `oklch(51.25% 0.2202 312.98)` | Pheromone Purple | white, 6.4 to 1 |
| 9 | `#992abb` | `oklch(52.21% 0.2204 316.64)` | Pink Spyro | white, 6.1 to 1 |
| 10 | `#a12bb9` | `oklch(53.27% 0.2199 320.13)` | Pink Spyro | white, 5.9 to 1 |
| 11 | `#a92eb6` | `oklch(54.43% 0.2188 323.58)` | Pink Spyro | white, 5.6 to 1 |
| 12 | `#b030b3` | `oklch(55.64% 0.2173 327.01)` | Vivid Fuchsia | white, 5.3 to 1 |
| 13 | `#b834b1` | `oklch(56.89% 0.2156 330.47)` | San Francisco Pink | white, 5 to 1 |
| 14 | `#c037ad` | `oklch(58.14% 0.2137 333.98)` | Pink Perennial | white, 4.7 to 1 |
| 15 | `#c73aaa` | `oklch(59.35% 0.2118 337.58)` | Pink Perennial | black, 4.6 to 1 |
| 16 | `#ce3da5` | `oklch(60.49% 0.2102 341.31)` | Krameria | black, 4.8 to 1 |
| 17 | `#d53fa0` | `oklch(61.54% 0.2088 345.20)` | Lustful Wishes | black, 5 to 1 |
| 18 | `#dc419b` | `oklch(62.52% 0.2076 349.29)` | Prunus Avium | black, 5.2 to 1 |
| 19 | `#e24494` | `oklch(63.46% 0.2066 353.52)` | Prunus Avium | black, 5.4 to 1 |
| 20 | `#e8468d` | `oklch(64.36% 0.2055 357.85)` | Majestic Magenta | black, 5.6 to 1 |
| 21 | `#ed4986` | `oklch(65.24% 0.2045 2.21)` | Majestic Magenta | black, 5.8 to 1 |
| 22 | `#f24c7e` | `oklch(66.11% 0.2033 6.55)` | Bonker Pink | black, 6.1 to 1 |
| 23 | `#f65076` | `oklch(66.99% 0.2019 10.83)` | Bonker Pink | black, 6.3 to 1 |
| 24 | `#fa556f` | `oklch(67.88% 0.2003 14.98)` | Fiery Rose | black, 6.5 to 1 |
| 25 | `#fd5a68` | `oklch(68.83% 0.1982 19.11)` | Festive Fennec | black, 6.8 to 1 |
| 26 | `#ff6262` | `oklch(69.85% 0.1922 23.47)` | Fusion Red | black, 7.1 to 1 |
| 27 | `#ff6b5d` | `oklch(70.91% 0.1834 27.93)` | Manila Sunset | black, 7.5 to 1 |
| 28 | `#ff7359` | `oklch(71.97% 0.1759 32.30)` | Fresh Salmon | black, 7.8 to 1 |
| 29 | `#ff7b56` | `oklch(72.97% 0.1698 36.42)` | Rinsed-Out Red | black, 8.2 to 1 |
| 30 | `#ff8153` | `oklch(73.87% 0.1650 40.13)` | Nārangī Orange | black, 8.5 to 1 |
| 31 | `#ff8652` | `oklch(74.63% 0.1616 43.24)` | Poached Rainbow Trout | black, 8.7 to 1 |
| 32 | `#ff8a50` | `oklch(75.20% 0.1593 45.58)` | Paradise Bird | black, 9 to 1 |

## CSS

```css
background: linear-gradient(135deg, #5b31c3 0.0%, #6030c3 3.2%, #662fc3 6.5%, #6e2ec3 9.7%, #772cc3 12.9%, #7f2bc1 16.1%, #882ac0 19.4%, #9129bd 22.6%, #992abb 25.8%, #a12bb9 29.0%, #a92eb6 32.3%, #b030b3 35.5%, #b834b1 38.7%, #c037ad 41.9%, #c73aaa 45.2%, #ce3da5 48.4%, #d53fa0 51.6%, #dc419b 54.8%, #e24494 58.1%, #e8468d 61.3%, #ed4986 64.5%, #f24c7e 67.7%, #f65076 71.0%, #fa556f 74.2%, #fd5a68 77.4%, #ff6262 80.6%, #ff6b5d 83.9%, #ff7359 87.1%, #ff7b56 90.3%, #ff8153 93.5%, #ff8652 96.8%, #ff8a50 100.0%);
background: linear-gradient(135deg in oklch, oklch(46.06% 0.2094 288.28) 0.0%, oklch(46.51% 0.2105 290.48) 3.2%, oklch(47.09% 0.2121 293.42) 6.5%, oklch(47.77% 0.2139 296.92) 9.7%, oklch(48.55% 0.2159 300.80) 12.9%, oklch(49.40% 0.2177 304.89) 16.1%, oklch(50.31% 0.2193 309.01) 19.4%, oklch(51.25% 0.2202 312.98) 22.6%, oklch(52.21% 0.2204 316.64) 25.8%, oklch(53.27% 0.2199 320.13) 29.0%, oklch(54.43% 0.2188 323.58) 32.3%, oklch(55.64% 0.2173 327.01) 35.5%, oklch(56.89% 0.2156 330.47) 38.7%, oklch(58.14% 0.2137 333.98) 41.9%, oklch(59.35% 0.2118 337.58) 45.2%, oklch(60.49% 0.2102 341.31) 48.4%, oklch(61.54% 0.2088 345.20) 51.6%, oklch(62.52% 0.2076 349.29) 54.8%, oklch(63.46% 0.2066 353.52) 58.1%, oklch(64.36% 0.2055 357.85) 61.3%, oklch(65.24% 0.2045 2.21) 64.5%, oklch(66.11% 0.2033 6.55) 67.7%, oklch(66.99% 0.2019 10.83) 71.0%, oklch(67.88% 0.2003 14.98) 74.2%, oklch(68.83% 0.1982 19.11) 77.4%, oklch(69.85% 0.1922 23.47) 80.6%, oklch(70.91% 0.1834 27.93) 83.9%, oklch(71.97% 0.1759 32.30) 87.1%, oklch(72.97% 0.1698 36.42) 90.3%, oklch(73.87% 0.1650 40.13) 93.5%, oklch(74.63% 0.1616 43.24) 96.8%, oklch(75.20% 0.1593 45.58) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.461 | 0.209 | 288.3 |
| 2 | 0.52 | 0.22 | 315.8 |
| 3 | 0.61 | 0.209 | 343.2 |
| 4 | 0.681 | 0.2 | 376 |
| 5 | 0.752 | 0.181 | 405.6 |

## In these collections

- [Orange and purple gradients](https://grabient.com/orange-and-purple-gradients)

## Other forms

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