# Vivid yellow, orange, pink and purple linear gradient

Vivid yellow, orange, pink and purple linear gradient with 32 colors: #e4ca58, #e6c855, #eac550, #eec24a, #f2bf44, #f6bb3f, #fab63a, #feb236, #ffad37, #ffa93b, #ffa43c, #ff9f3c, #ff9a3b, #ff9339, #ff8d38, #fe8639, #fc7f3e, #fa7943, #f7724a, #f36c50, #ee6556, #e85f5b, #e25960, #db5364, #d34d67, #c94769, #bd416b, #b23b6b, #a6356a, #9c316a, #942d69, #8d2a68. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kW1WJE5zm9F2-PRPPbwOjY8g`
- Page: https://grabient.com/kW1WJE5zm9F2-PRPPbwOjY8g?steps=32&angle=135
- Drawn as: linear gradient, 32 steps, 135 degrees
- Kinds: light to dark, vivid, warm, multicolor
- Hues: wide
- Contrast of its darkest and lightest colors: 4.8 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 | `#e4ca58` | `oklch(83.86% 0.1350 96.33)` | Golden Trident | black, 12.8 to 1 |
| 2 | `#e6c855` | `oklch(83.67% 0.1370 94.38)` | Golden Trident | black, 12.7 to 1 |
| 3 | `#eac550` | `oklch(83.46% 0.1397 91.78)` | Yellow Brick Road | black, 12.6 to 1 |
| 4 | `#eec24a` | `oklch(83.21% 0.1429 88.69)` | Hive Delight | black, 12.4 to 1 |
| 5 | `#f2bf44` | `oklch(82.91% 0.1464 85.25)` | Adonis Rose Yellow | black, 12.2 to 1 |
| 6 | `#f6bb3f` | `oklch(82.54% 0.1500 81.63)` | Yellow Groove | black, 12 to 1 |
| 7 | `#fab63a` | `oklch(82.10% 0.1535 77.99)` | Glowing Lantern | black, 11.8 to 1 |
| 8 | `#feb236` | `oklch(81.57% 0.1565 74.48)` | Corona | black, 11.5 to 1 |
| 9 | `#ffad37` | `oklch(80.93% 0.1570 71.25)` | Blissful Orange | black, 11.3 to 1 |
| 10 | `#ffa93b` | `oklch(80.21% 0.1556 68.20)` | Match Strike | black, 10.9 to 1 |
| 11 | `#ffa43c` | `oklch(79.39% 0.1558 65.22)` | Radiation Carrot | black, 10.6 to 1 |
| 12 | `#ff9f3c` | `oklch(78.50% 0.1572 62.27)` | Hawaiian Passion | black, 10.2 to 1 |
| 13 | `#ff9a3b` | `oklch(77.53% 0.1596 59.27)` | Indian Saffron | black, 9.9 to 1 |
| 14 | `#ff9339` | `oklch(76.49% 0.1629 56.19)` | Energy Orange | black, 9.5 to 1 |
| 15 | `#ff8d38` | `oklch(75.39% 0.1670 52.96)` | Kanzō Orange | black, 9.1 to 1 |
| 16 | `#fe8639` | `oklch(74.22% 0.1705 49.52)` | Sunset Yellow | black, 8.6 to 1 |
| 17 | `#fc7f3e` | `oklch(73.01% 0.1712 45.83)` | Sagittarius Amber Artefact | black, 8.2 to 1 |
| 18 | `#fa7943` | `oklch(71.74% 0.1718 41.85)` | Precious Persimmon | black, 7.8 to 1 |
| 19 | `#f7724a` | `oklch(70.41% 0.1721 37.63)` | Coral Rose | black, 7.4 to 1 |
| 20 | `#f36c50` | `oklch(69.02% 0.1723 33.26)` | Royal Blush | black, 7 to 1 |
| 21 | `#ee6556` | `oklch(67.56% 0.1721 28.83)` | Flattered Flamingo | black, 6.6 to 1 |
| 22 | `#e85f5b` | `oklch(66.01% 0.1717 24.41)` | Reductant | black, 6.2 to 1 |
| 23 | `#e25960` | `oklch(64.38% 0.1710 20.09)` | Aphrodisiac | black, 5.8 to 1 |
| 24 | `#db5364` | `oklch(62.65% 0.1698 15.96)` | Cranberry Splash | black, 5.4 to 1 |
| 25 | `#d34d67` | `oklch(60.74% 0.1682 11.91)` | Cabaret | black, 5 to 1 |
| 26 | `#c94769` | `oklch(58.49% 0.1657 7.67)` | Royal Banner | white, 4.5 to 1 |
| 27 | `#bd416b` | `oklch(56.04% 0.1627 3.36)` | Mauve It | white, 5 to 1 |
| 28 | `#b23b6b` | `oklch(53.53% 0.1595 359.16)` | Cactus Flower | white, 5.6 to 1 |
| 29 | `#a6356a` | `oklch(51.10% 0.1562 355.20)` | Valentine’s Day | white, 6.2 to 1 |
| 30 | `#9c316a` | `oklch(48.89% 0.1532 351.66)` | Scarlet Flame | white, 6.8 to 1 |
| 31 | `#942d69` | `oklch(47.03% 0.1506 348.68)` | Beetiful Magenta | white, 7.4 to 1 |
| 32 | `#8d2a68` | `oklch(45.67% 0.1488 346.43)` | Beetiful Magenta | white, 7.8 to 1 |

## CSS

```css
background: linear-gradient(135deg, #e4ca58 0.0%, #e6c855 3.2%, #eac550 6.5%, #eec24a 9.7%, #f2bf44 12.9%, #f6bb3f 16.1%, #fab63a 19.4%, #feb236 22.6%, #ffad37 25.8%, #ffa93b 29.0%, #ffa43c 32.3%, #ff9f3c 35.5%, #ff9a3b 38.7%, #ff9339 41.9%, #ff8d38 45.2%, #fe8639 48.4%, #fc7f3e 51.6%, #fa7943 54.8%, #f7724a 58.1%, #f36c50 61.3%, #ee6556 64.5%, #e85f5b 67.7%, #e25960 71.0%, #db5364 74.2%, #d34d67 77.4%, #c94769 80.6%, #bd416b 83.9%, #b23b6b 87.1%, #a6356a 90.3%, #9c316a 93.5%, #942d69 96.8%, #8d2a68 100.0%);
background: linear-gradient(135deg in oklch, oklch(83.86% 0.1350 96.33) 0.0%, oklch(83.67% 0.1370 94.38) 3.2%, oklch(83.46% 0.1397 91.78) 6.5%, oklch(83.21% 0.1429 88.69) 9.7%, oklch(82.91% 0.1464 85.25) 12.9%, oklch(82.54% 0.1500 81.63) 16.1%, oklch(82.10% 0.1535 77.99) 19.4%, oklch(81.57% 0.1565 74.48) 22.6%, oklch(80.93% 0.1570 71.25) 25.8%, oklch(80.21% 0.1556 68.20) 29.0%, oklch(79.39% 0.1558 65.22) 32.3%, oklch(78.50% 0.1572 62.27) 35.5%, oklch(77.53% 0.1596 59.27) 38.7%, oklch(76.49% 0.1629 56.19) 41.9%, oklch(75.39% 0.1670 52.96) 45.2%, oklch(74.22% 0.1705 49.52) 48.4%, oklch(73.01% 0.1712 45.83) 51.6%, oklch(71.74% 0.1718 41.85) 54.8%, oklch(70.41% 0.1721 37.63) 58.1%, oklch(69.02% 0.1723 33.26) 61.3%, oklch(67.56% 0.1721 28.83) 64.5%, oklch(66.01% 0.1717 24.41) 67.7%, oklch(64.38% 0.1710 20.09) 71.0%, oklch(62.65% 0.1698 15.96) 74.2%, oklch(60.74% 0.1682 11.91) 77.4%, oklch(58.49% 0.1657 7.67) 80.6%, oklch(56.04% 0.1627 3.36) 83.9%, oklch(53.53% 0.1595 359.16) 87.1%, oklch(51.10% 0.1562 355.20) 90.3%, oklch(48.89% 0.1532 351.66) 93.5%, oklch(47.03% 0.1506 348.68) 96.8%, oklch(45.67% 0.1488 346.43) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.839 | 0.135 | 96.3 |
| 2 | 0.811 | 0.158 | 72 |
| 3 | 0.736 | 0.171 | 47.7 |
| 4 | 0.622 | 0.169 | 15 |
| 5 | 0.457 | 0.149 | -13.6 |

## In these collections

- [Thanksgiving gradients](https://grabient.com/thanksgiving-gradients)

## Other forms

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