# Violet and yellow bright palette

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

- Also called: Purple to beige radial gradient
- Seed: `kSkInT5abCvomUa`
- Page: https://grabient.com/kSkInT5abCvomUa?style=radialGradient&steps=32&angle=0
- Drawn as: radial gradient, 32 steps, 0 degrees
- Kinds: dark to light, vivid
- Hues: analogous
- Contrast of its darkest and lightest colors: 4.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 | `#8555d5` | `oklch(56.69% 0.1888 297.42)` | Gloomy Purple | white, 4.9 to 1 |
| 2 | `#8958d6` | `oklch(57.55% 0.1856 298.02)` | Gloomy Purple | white, 4.7 to 1 |
| 3 | `#8c5dd7` | `oklch(58.60% 0.1816 298.36)` | Gloomy Purple | black, 4.6 to 1 |
| 4 | `#8f62d9` | `oklch(59.83% 0.1768 298.54)` | Legendary Lavender | black, 4.9 to 1 |
| 5 | `#9367db` | `oklch(61.21% 0.1713 298.64)` | Matt Purple | black, 5.2 to 1 |
| 6 | `#976ddd` | `oklch(62.72% 0.1654 298.73)` | Matt Purple | black, 5.5 to 1 |
| 7 | `#9b74df` | `oklch(64.32% 0.1591 298.91)` | Matt Purple | black, 5.9 to 1 |
| 8 | `#a07ae1` | `oklch(66.00% 0.1525 299.25)` | Matt Purple | black, 6.3 to 1 |
| 9 | `#a680e3` | `oklch(67.73% 0.1459 299.84)` | Lavender Blossom | black, 6.8 to 1 |
| 10 | `#ac87e5` | `oklch(69.50% 0.1392 300.77)` | Lavender Blossom | black, 7.3 to 1 |
| 11 | `#b28de7` | `oklch(71.26% 0.1328 302.11)` | Dreamy Candy Forest | black, 7.8 to 1 |
| 12 | `#b993e8` | `oklch(73.00% 0.1266 303.95)` | Bright Lavender | black, 8.3 to 1 |
| 13 | `#c098e9` | `oklch(74.70% 0.1209 306.38)` | Bright Lavender | black, 8.9 to 1 |
| 14 | `#c89dea` | `oklch(76.32% 0.1157 309.47)` | Lavender Cream | black, 9.4 to 1 |
| 15 | `#d0a2e9` | `oklch(77.85% 0.1112 313.32)` | Bright Ube | black, 10 to 1 |
| 16 | `#d8a5e8` | `oklch(79.27% 0.1076 317.99)` | Petal Plush | black, 10.5 to 1 |
| 17 | `#e1a9e6` | `oklch(80.56% 0.1048 323.67)` | Candy Floss | black, 10.9 to 1 |
| 18 | `#eaabe3` | `oklch(81.83% 0.1028 330.82)` | Land of Dreams | black, 11.4 to 1 |
| 19 | `#f4aedd` | `oklch(83.10% 0.1013 339.32)` | Hanami Pink | black, 11.9 to 1 |
| 20 | `#feb1d6` | `oklch(84.36% 0.1003 348.94)` | Lavender Candy | black, 12.4 to 1 |
| 21 | `#ffb9ce` | `oklch(85.61% 0.0849 359.45)` | Tentacle Pink | black, 13 to 1 |
| 22 | `#ffc1c8` | `oklch(86.83% 0.0721 10.65)` | Piglet | black, 13.6 to 1 |
| 23 | `#ffc8c5` | `oklch(88.01% 0.0634 22.30)` | Hooked Mimosa | black, 14.3 to 1 |
| 24 | `#ffcec2` | `oklch(89.16% 0.0578 34.18)` | Crystal Coral | black, 14.9 to 1 |
| 25 | `#ffd4c1` | `oklch(90.26% 0.0548 46.07)` | Simply Delicious | black, 15.4 to 1 |
| 26 | `#ffdac0` | `oklch(91.31% 0.0542 57.74)` | Karry | black, 16 to 1 |
| 27 | `#ffe0be` | `oklch(92.30% 0.0563 68.97)` | Odious Orange | black, 16.6 to 1 |
| 28 | `#ffe5bb` | `oklch(93.22% 0.0619 79.54)` | Butter Creme | black, 17.1 to 1 |
| 29 | `#ffeab3` | `oklch(94.06% 0.0733 89.22)` | Lively Yellow | black, 17.6 to 1 |
| 30 | `#ffefa3` | `oklch(94.82% 0.0963 97.80)` | Buttered Popcorn | black, 18.1 to 1 |
| 31 | `#faf5a1` | `oklch(95.49% 0.1046 105.04)` | Yippie Ya Yellow | black, 18.6 to 1 |
| 32 | `#f5f9a6` | `oklch(96.06% 0.1047 110.73)` | Yellow Chalk | black, 19 to 1 |

## CSS

```css
background: radial-gradient(circle at 50% 50%, #8555d5 0.0%, #8958d6 3.2%, #8c5dd7 6.5%, #8f62d9 9.7%, #9367db 12.9%, #976ddd 16.1%, #9b74df 19.4%, #a07ae1 22.6%, #a680e3 25.8%, #ac87e5 29.0%, #b28de7 32.3%, #b993e8 35.5%, #c098e9 38.7%, #c89dea 41.9%, #d0a2e9 45.2%, #d8a5e8 48.4%, #e1a9e6 51.6%, #eaabe3 54.8%, #f4aedd 58.1%, #feb1d6 61.3%, #ffb9ce 64.5%, #ffc1c8 67.7%, #ffc8c5 71.0%, #ffcec2 74.2%, #ffd4c1 77.4%, #ffdac0 80.6%, #ffe0be 83.9%, #ffe5bb 87.1%, #ffeab3 90.3%, #ffefa3 93.5%, #faf5a1 96.8%, #f5f9a6 100.0%);
background: radial-gradient(circle at 50% 50% in oklch, oklch(56.69% 0.1888 297.42) 0.0%, oklch(57.55% 0.1856 298.02) 3.2%, oklch(58.60% 0.1816 298.36) 6.5%, oklch(59.83% 0.1768 298.54) 9.7%, oklch(61.21% 0.1713 298.64) 12.9%, oklch(62.72% 0.1654 298.73) 16.1%, oklch(64.32% 0.1591 298.91) 19.4%, oklch(66.00% 0.1525 299.25) 22.6%, oklch(67.73% 0.1459 299.84) 25.8%, oklch(69.50% 0.1392 300.77) 29.0%, oklch(71.26% 0.1328 302.11) 32.3%, oklch(73.00% 0.1266 303.95) 35.5%, oklch(74.70% 0.1209 306.38) 38.7%, oklch(76.32% 0.1157 309.47) 41.9%, oklch(77.85% 0.1112 313.32) 45.2%, oklch(79.27% 0.1076 317.99) 48.4%, oklch(80.56% 0.1048 323.67) 51.6%, oklch(81.83% 0.1028 330.82) 54.8%, oklch(83.10% 0.1013 339.32) 58.1%, oklch(84.36% 0.1003 348.94) 61.3%, oklch(85.61% 0.0849 359.45) 64.5%, oklch(86.83% 0.0721 10.65) 67.7%, oklch(88.01% 0.0634 22.30) 71.0%, oklch(89.16% 0.0578 34.18) 74.2%, oklch(90.26% 0.0548 46.07) 77.4%, oklch(91.31% 0.0542 57.74) 80.6%, oklch(92.30% 0.0563 68.97) 83.9%, oklch(93.22% 0.0619 79.54) 87.1%, oklch(94.06% 0.0733 89.22) 90.3%, oklch(94.82% 0.0963 97.80) 93.5%, oklch(95.49% 0.1046 105.04) 96.8%, oklch(96.06% 0.1047 110.73) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.567 | 0.189 | 297.4 |
| 2 | 0.799 | 0.106 | 320.7 |
| 3 | 0.961 | 0.105 | 470.7 |

## In these collections

- [Bright gradients](https://grabient.com/bright-gradients)

## Other forms

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