# Purple and Yellow: Aubergine and gold

The "Purple and Yellow: Aubergine and gold" palette brings together purple, light purple, light yellow, and gold. The colors span a broad lightness range, combining moderate color with clear contrast. Its balanced and composed character suits brand mood boards and editorial graphics. Its darkest tone is purple, and its lightest tone is light yellow.

- Also called: Purple, tan, mustard and brown linear swatches
- Seed: `kWVl7c5x0-nKoUtgtr8ya8-4`
- Page: https://grabient.com/kWVl7c5x0-nKoUtgtr8ya8-4?style=linearSwatches&steps=5
- Drawn as: linear swatches, 5 steps, 90 degrees
- Kinds: light center, pastel, multicolor
- Hues: complementary
- Contrast of its darkest and lightest colors: 9.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 | `#4c1c68` | `oklch(33.86% 0.1295 310.08)` | Fading Horizon | white, 12.5 to 1 |
| 2 | `#c7b7ef` | `oklch(81.10% 0.0799 298.45)` | Connecticut Lilac | black, 11.4 to 1 |
| 3 | `#f2e088` | `oklch(90.16% 0.1102 98.02)` | Shinjuku Gold | black, 15.7 to 1 |
| 4 | `#d4ad1a` | `oklch(75.98% 0.1502 91.68)` | Burnt Yellow | black, 9.7 to 1 |
| 5 | `#9c7200` | `oklch(57.87% 0.1190 83.21)` | Barbarian Leather | black, 4.8 to 1 |

## CSS

```css
background: linear-gradient(90deg, #4c1c68 0.000% 20.000%, #c7b7ef 20.000% 40.000%, #f2e088 40.000% 60.000%, #d4ad1a 60.000% 80.000%, #9c7200 80.000% 100.000%);
background: linear-gradient(90deg, oklch(33.86% 0.1295 310.08) 0.000% 20.000%, oklch(81.10% 0.0799 298.45) 20.000% 40.000%, oklch(90.16% 0.1102 98.02) 40.000% 60.000%, oklch(75.98% 0.1502 91.68) 60.000% 80.000%, oklch(57.87% 0.1190 83.21) 80.000% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.339 | 0.13 | 310.1 |
| 2 | 0.811 | 0.08 | 298.5 |
| 3 | 0.902 | 0.11 | 458 |
| 4 | 0.76 | 0.15 | 451.7 |
| 5 | 0.579 | 0.13 | 443.2 |

## In these collections

- [Purple and yellow swatches](https://grabient.com/purple-and-yellow-swatches)

## Other forms

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