# Vivid tritone orange, purple and red linear gradient

Vivid tritone orange, purple and red linear gradient with 32 colors: #f7b54a, #f19f4b, #e28254, #c86560, #a44c69, #7e3a6b, #5d2c66, #46235f, #3e1e5b, #431d5c, #52205e, #6a245d, #852c58, #a0374c, #b6473b, #c45727, #cc6314, #d36f00, #d87c00, #df8600, #e58d00, #eb9200, #ef9313, #f18f22, #f08530, #ea7543, #dd6256, #c95067, #af4275, #95387d, #7d3281, #6c2e82. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kWz2c2KCawcy4S_dusGNjSzo`
- Page: https://grabient.com/kWz2c2KCawcy4S_dusGNjSzo?steps=32&angle=135
- Drawn as: linear gradient, 32 steps, 135 degrees
- Kinds: vivid, warm
- Hues: wide
- Contrast of its darkest and lightest colors: 7.5 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 | `#f7b54a` | `oklch(81.50% 0.1419 75.94)` | Mango Margarita | black, 11.6 to 1 |
| 2 | `#f19f4b` | `oklch(76.92% 0.1385 63.76)` | Osage Orange | black, 9.8 to 1 |
| 3 | `#e28254` | `oklch(70.20% 0.1332 45.69)` | Show Business | black, 7.5 to 1 |
| 4 | `#c86560` | `oklch(62.16% 0.1268 24.06)` | Fuzzy Wuzzy | black, 5.4 to 1 |
| 5 | `#a44c69` | `oklch(53.64% 0.1202 1.24)` | Raspberry Patch | white, 5.4 to 1 |
| 6 | `#7e3a6b` | `oklch(45.45% 0.1141 339.55)` | Deep Commitment to Purple | white, 7.7 to 1 |
| 7 | `#5d2c66` | `oklch(38.44% 0.1092 321.34)` | Imperial Purple | white, 10.3 to 1 |
| 8 | `#46235f` | `oklch(33.44% 0.1064 308.96)` | Fading Horizon | white, 12.5 to 1 |
| 9 | `#3e1e5b` | `oklch(31.24% 0.1064 304.71)` | Christalle | white, 13.6 to 1 |
| 10 | `#431d5c` | `oklch(31.83% 0.1096 309.03)` | Plunged Into Darkness | white, 13.3 to 1 |
| 11 | `#52205e` | `oklch(34.54% 0.1152 319.98)` | Elegant Purple Gown | white, 12.1 to 1 |
| 12 | `#6a245d` | `oklch(38.77% 0.1225 335.49)` | Palatinate Purple | white, 10.3 to 1 |
| 13 | `#852c58` | `oklch(43.90% 0.1307 353.49)` | Dark Raspberry | white, 8.3 to 1 |
| 14 | `#a0374c` | `oklch(49.33% 0.1389 11.92)` | Scarlet Ribbons | white, 6.6 to 1 |
| 15 | `#b6473b` | `oklch(54.45% 0.1463 28.72)` | Habañero Chile | white, 5.3 to 1 |
| 16 | `#c45727` | `oklch(58.66% 0.1522 41.83)` | Grieving Daylily | black, 4.7 to 1 |
| 17 | `#cc6314` | `oklch(61.62% 0.1560 49.94)` | Brusque Brown | black, 5.3 to 1 |
| 18 | `#d36f00` | `oklch(64.47% 0.1573 56.28)` | Marmalade | black, 6 to 1 |
| 19 | `#d87c00` | `oklch(67.26% 0.1557 61.39)` | Orange Pepper | black, 6.7 to 1 |
| 20 | `#df8600` | `oklch(69.81% 0.1566 65.05)` | Non-Stop Orange | black, 7.5 to 1 |
| 21 | `#e58d00` | `oklch(71.94% 0.1589 67.08)` | Hotter Butter | black, 8.1 to 1 |
| 22 | `#eb9200` | `oklch(73.45% 0.1620 67.28)` | Gold Fusion | black, 8.6 to 1 |
| 23 | `#ef9313` | `oklch(74.15% 0.1619 65.48)` | Forceful Orange | black, 8.8 to 1 |
| 24 | `#f18f22` | `oklch(73.87% 0.1614 61.46)` | Carrot Orange | black, 8.7 to 1 |
| 25 | `#f08530` | `oklch(72.24% 0.1605 54.26)` | Kid’s Stuff | black, 8.1 to 1 |
| 26 | `#ea7543` | `oklch(69.00% 0.1587 42.60)` | Debrito | black, 7.1 to 1 |
| 27 | `#dd6256` | `oklch(64.61% 0.1564 27.79)` | Barely Brown | black, 5.9 to 1 |
| 28 | `#c95067` | `oklch(59.56% 0.1537 11.28)` | Eros Pink | black, 4.8 to 1 |
| 29 | `#af4275` | `oklch(54.34% 0.1510 354.47)` | Mystic Maroon | white, 5.4 to 1 |
| 30 | `#95387d` | `oklch(49.44% 0.1484 338.79)` | Purple Wine | white, 6.6 to 1 |
| 31 | `#7d3281` | `oklch(45.33% 0.1462 325.67)` | Sparkling Grape | white, 7.9 to 1 |
| 32 | `#6c2e82` | `oklch(42.52% 0.1447 316.52)` | Galactic Grapevine | white, 8.9 to 1 |

## CSS

```css
background: linear-gradient(135deg, #f7b54a 0.0%, #f19f4b 3.2%, #e28254 6.5%, #c86560 9.7%, #a44c69 12.9%, #7e3a6b 16.1%, #5d2c66 19.4%, #46235f 22.6%, #3e1e5b 25.8%, #431d5c 29.0%, #52205e 32.3%, #6a245d 35.5%, #852c58 38.7%, #a0374c 41.9%, #b6473b 45.2%, #c45727 48.4%, #cc6314 51.6%, #d36f00 54.8%, #d87c00 58.1%, #df8600 61.3%, #e58d00 64.5%, #eb9200 67.7%, #ef9313 71.0%, #f18f22 74.2%, #f08530 77.4%, #ea7543 80.6%, #dd6256 83.9%, #c95067 87.1%, #af4275 90.3%, #95387d 93.5%, #7d3281 96.8%, #6c2e82 100.0%);
background: linear-gradient(135deg in oklch, oklch(81.50% 0.1419 75.94) 0.0%, oklch(76.92% 0.1385 63.76) 3.2%, oklch(70.20% 0.1332 45.69) 6.5%, oklch(62.16% 0.1268 24.06) 9.7%, oklch(53.64% 0.1202 1.24) 12.9%, oklch(45.45% 0.1141 339.55) 16.1%, oklch(38.44% 0.1092 321.34) 19.4%, oklch(33.44% 0.1064 308.96) 22.6%, oklch(31.24% 0.1064 304.71) 25.8%, oklch(31.83% 0.1096 309.03) 29.0%, oklch(34.54% 0.1152 319.98) 32.3%, oklch(38.77% 0.1225 335.49) 35.5%, oklch(43.90% 0.1307 353.49) 38.7%, oklch(49.33% 0.1389 11.92) 41.9%, oklch(54.45% 0.1463 28.72) 45.2%, oklch(58.66% 0.1522 41.83) 48.4%, oklch(61.62% 0.1560 49.94) 51.6%, oklch(64.47% 0.1573 56.28) 54.8%, oklch(67.26% 0.1557 61.39) 58.1%, oklch(69.81% 0.1566 65.05) 61.3%, oklch(71.94% 0.1589 67.08) 64.5%, oklch(73.45% 0.1620 67.28) 67.7%, oklch(74.15% 0.1619 65.48) 71.0%, oklch(73.87% 0.1614 61.46) 74.2%, oklch(72.24% 0.1605 54.26) 77.4%, oklch(69.00% 0.1587 42.60) 80.6%, oklch(64.61% 0.1564 27.79) 83.9%, oklch(59.56% 0.1537 11.28) 87.1%, oklch(54.34% 0.1510 354.47) 90.3%, oklch(49.44% 0.1484 338.79) 93.5%, oklch(45.33% 0.1462 325.67) 96.8%, oklch(42.52% 0.1447 316.52) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.815 | 0.142 | 75.9 |
| 2 | 0.315 | 0.106 | -55.1 |
| 3 | 0.602 | 0.154 | 46.3 |
| 4 | 0.736 | 0.161 | 60.1 |
| 5 | 0.425 | 0.145 | -43.5 |

## Other forms

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