# Violet orange and purple palette

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

- Also called: Vivid peach, purple, pink and orange angular gradient
- Seed: `kW0F4w0cw6bC9thJzEU28HHA`
- Page: https://grabient.com/kW0F4w0cw6bC9thJzEU28HHA?style=angularGradient&steps=32
- Drawn as: angular gradient, 32 steps, 90 degrees
- Kinds: dark center, vivid
- Hues: wide
- Contrast of its darkest and lightest colors: 6 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 | `#fbb360` | `oklch(81.89% 0.1295 68.20)` | Ripe Cantaloupe | black, 11.7 to 1 |
| 2 | `#fcac58` | `oklch(80.53% 0.1368 64.75)` | Soul Side | black, 11.1 to 1 |
| 3 | `#fda14c` | `oklch(78.78% 0.1474 60.42)` | Exotic Flower | black, 10.4 to 1 |
| 4 | `#ff9440` | `oklch(76.70% 0.1597 55.29)` | Energy Orange | black, 9.5 to 1 |
| 5 | `#ff8639` | `oklch(74.35% 0.1707 49.40)` | Wildfire | black, 8.7 to 1 |
| 6 | `#ff7535` | `oklch(71.79% 0.1845 42.83)` | Orange Supreme | black, 7.8 to 1 |
| 7 | `#fd6239` | `oklch(69.08% 0.1979 35.63)` | Toxic Orange | black, 6.9 to 1 |
| 8 | `#f85045` | `oklch(66.29% 0.2061 27.86)` | Pumping Spice | black, 6.2 to 1 |
| 9 | `#ee4054` | `oklch(63.44% 0.2099 19.51)` | Vineyard Autumn | black, 5.5 to 1 |
| 10 | `#df3166` | `oklch(59.95% 0.2089 8.94)` | 1989 Miami Hotline | black, 4.7 to 1 |
| 11 | `#c82777` | `oklch(55.87% 0.2042 356.35)` | Prince Charming | white, 5.2 to 1 |
| 12 | `#ad2285` | `oklch(51.53% 0.1971 342.78)` | Magneto’s Magenta | white, 6.2 to 1 |
| 13 | `#91218d` | `oklch(47.28% 0.1888 329.31)` | Acai Juice | white, 7.5 to 1 |
| 14 | `#772091` | `oklch(43.48% 0.1807 316.99)` | Orb of Discord | white, 8.7 to 1 |
| 15 | `#621f90` | `oklch(40.47% 0.1740 306.89)` | Purplex | white, 9.9 to 1 |
| 16 | `#541f8f` | `oklch(38.59% 0.1700 300.07)` | American Violet | white, 10.6 to 1 |
| 17 | `#501f8f` | `oklch(38.18% 0.1699 297.45)` | Eggplant Tint | white, 10.8 to 1 |
| 18 | `#552193` | `oklch(39.21% 0.1732 298.53)` | Eine Kleine Nachtmusik | white, 10.3 to 1 |
| 19 | `#602399` | `oklch(41.35% 0.1789 302.52)` | Wild Violet | white, 9.5 to 1 |
| 20 | `#71269f` | `oklch(44.29% 0.1860 308.70)` | Orb of Discord | white, 8.4 to 1 |
| 21 | `#8529a3` | `oklch(47.68% 0.1935 316.34)` | Passionate Purple | white, 7.3 to 1 |
| 22 | `#9b2ca4` | `oklch(51.20% 0.2005 324.74)` | Purple Ink | white, 6.3 to 1 |
| 23 | `#b12ea2` | `oklch(54.51% 0.2060 333.15)` | Vivid Fuchsia | white, 5.5 to 1 |
| 24 | `#c3329c` | `oklch(57.30% 0.2092 340.87)` | Byzantine | white, 4.9 to 1 |
| 25 | `#d13694` | `oklch(59.52% 0.2092 348.06)` | Magenta Pink | black, 4.6 to 1 |
| 26 | `#de3c89` | `oklch(61.73% 0.2070 356.32)` | Prunus Avium | black, 5.1 to 1 |
| 27 | `#e9457b` | `oklch(63.89% 0.2031 5.26)` | Kacey’s Pink | black, 5.5 to 1 |
| 28 | `#f24f6b` | `oklch(65.94% 0.1981 14.37)` | Pink Pepper | black, 6.1 to 1 |
| 29 | `#f85b5c` | `oklch(67.84% 0.1928 23.18)` | Grapefruit | black, 6.6 to 1 |
| 30 | `#fb664e` | `oklch(69.53% 0.1876 31.18)` | Sango Red | black, 7.1 to 1 |
| 31 | `#fd7043` | `oklch(70.95% 0.1833 37.90)` | Carrot | black, 7.5 to 1 |
| 32 | `#fe773a` | `oklch(72.05% 0.1805 42.84)` | Synthetic Pumpkin | black, 7.9 to 1 |

## CSS

```css
background: conic-gradient(from 90deg, #fbb360 0.0%, #fcac58 3.2%, #fda14c 6.5%, #ff9440 9.7%, #ff8639 12.9%, #ff7535 16.1%, #fd6239 19.4%, #f85045 22.6%, #ee4054 25.8%, #df3166 29.0%, #c82777 32.3%, #ad2285 35.5%, #91218d 38.7%, #772091 41.9%, #621f90 45.2%, #541f8f 48.4%, #501f8f 51.6%, #552193 54.8%, #602399 58.1%, #71269f 61.3%, #8529a3 64.5%, #9b2ca4 67.7%, #b12ea2 71.0%, #c3329c 74.2%, #d13694 77.4%, #de3c89 80.6%, #e9457b 83.9%, #f24f6b 87.1%, #f85b5c 90.3%, #fb664e 93.5%, #fd7043 96.8%, #fe773a 100.0%);
background: conic-gradient(from 90deg in oklch, oklch(81.89% 0.1295 68.20) 0.0%, oklch(80.53% 0.1368 64.75) 3.2%, oklch(78.78% 0.1474 60.42) 6.5%, oklch(76.70% 0.1597 55.29) 9.7%, oklch(74.35% 0.1707 49.40) 12.9%, oklch(71.79% 0.1845 42.83) 16.1%, oklch(69.08% 0.1979 35.63) 19.4%, oklch(66.29% 0.2061 27.86) 22.6%, oklch(63.44% 0.2099 19.51) 25.8%, oklch(59.95% 0.2089 8.94) 29.0%, oklch(55.87% 0.2042 356.35) 32.3%, oklch(51.53% 0.1971 342.78) 35.5%, oklch(47.28% 0.1888 329.31) 38.7%, oklch(43.48% 0.1807 316.99) 41.9%, oklch(40.47% 0.1740 306.89) 45.2%, oklch(38.59% 0.1700 300.07) 48.4%, oklch(38.18% 0.1699 297.45) 51.6%, oklch(39.21% 0.1732 298.53) 54.8%, oklch(41.35% 0.1789 302.52) 58.1%, oklch(44.29% 0.1860 308.70) 61.3%, oklch(47.68% 0.1935 316.34) 64.5%, oklch(51.20% 0.2005 324.74) 67.7%, oklch(54.51% 0.2060 333.15) 71.0%, oklch(57.30% 0.2092 340.87) 74.2%, oklch(59.52% 0.2092 348.06) 77.4%, oklch(61.73% 0.2070 356.32) 80.6%, oklch(63.89% 0.2031 5.26) 83.9%, oklch(65.94% 0.1981 14.37) 87.1%, oklch(67.84% 0.1928 23.18) 90.3%, oklch(69.53% 0.1876 31.18) 93.5%, oklch(70.95% 0.1833 37.90) 96.8%, oklch(72.05% 0.1805 42.84) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.819 | 0.13 | 68.2 |
| 2 | 0.642 | 0.209 | 21.7 |
| 3 | 0.382 | 0.169 | -61.8 |
| 4 | 0.579 | 0.209 | -17.4 |
| 5 | 0.72 | 0.181 | 42.8 |

## In these collections

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

## Other forms

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