# Aubergine color palette

The Aubergine color palette brings together dark purple, purple, and magenta. The colors span a moderate lightness range, combining strong color with clear contrast. Its bold and dramatic character suits website sections and interface mockups. Its darkest tone is dark purple, and its lightest tone is magenta.

- Also called: Monochrome dark purple and purple angular swatches
- Seed: `kYPkDXrrHA77AwLSOcEObu-qgrPq`
- Page: https://grabient.com/kYPkDXrrHA77AwLSOcEObu-qgrPq?style=angularSwatches&steps=6&angle=225
- Drawn as: angular swatches, 6 steps, 225 degrees
- Kinds: light center, vivid, monochrome
- Hues: analogous
- Contrast of its darkest and lightest colors: 4.7 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 | `#291142` | `oklch(24.41% 0.0882 303.05)` | Oily Purple | white, 16.7 to 1 |
| 2 | `#562172` | `oklch(36.61% 0.1364 311.50)` | Violethargic | white, 11.3 to 1 |
| 3 | `#8935a1` | `oklch(49.21% 0.1778 317.84)` | Pleasant Purple | white, 6.8 to 1 |
| 4 | `#bf67bf` | `oklch(64.57% 0.1585 327.35)` | Purple Urn Orchid | black, 5.9 to 1 |
| 5 | `#792e91` | `oklch(45.28% 0.1640 316.78)` | Skeletor’s Cape | white, 8 to 1 |
| 6 | `#411a60` | `oklch(31.50% 0.1185 306.22)` | Obsidian Shell | white, 13.6 to 1 |

## CSS

```css
background: conic-gradient(from 225deg, #291142 0.000% 16.667%, #562172 16.667% 33.333%, #8935a1 33.333% 50.000%, #bf67bf 50.000% 66.667%, #792e91 66.667% 83.333%, #411a60 83.333% 100.000%);
background: conic-gradient(from 225deg, oklch(24.41% 0.0882 303.05) 0.000% 16.667%, oklch(36.61% 0.1364 311.50) 16.667% 33.333%, oklch(49.21% 0.1778 317.84) 33.333% 50.000%, oklch(64.57% 0.1585 327.35) 50.000% 66.667%, oklch(45.28% 0.1640 316.78) 66.667% 83.333%, oklch(31.50% 0.1185 306.22) 83.333% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.244 | 0.088 | 303 |
| 2 | 0.366 | 0.136 | 311.5 |
| 3 | 0.492 | 0.178 | 317.8 |
| 4 | 0.646 | 0.158 | 327.4 |
| 5 | 0.453 | 0.164 | 316.8 |
| 6 | 0.315 | 0.119 | 306.2 |

## In these collections

- [Jewel tone swatches](https://grabient.com/jewel-tone-swatches)
- [Dark swatches](https://grabient.com/dark-swatches)
- [Jewel tones](https://grabient.com/jewel-tones)

## Other forms

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