# Lavender purple and pink palette

The Lavender purple and pink palette brings together light purple, dark purple, blue, and magenta. 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 dark purple, and its lightest tone is light purple.

- Also called: Lavender, dark purple and mauve linear swatches
- Seed: `kU0CTVo5nBr0oPPWmcZg`
- Page: https://grabient.com/kU0CTVo5nBr0oPPWmcZg?style=linearSwatches&steps=4
- Drawn as: linear swatches, 4 steps, 90 degrees
- Kinds: dark center, muted
- Hues: analogous
- Contrast of its darkest and lightest colors: 8.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 | `#c8bde0` | `oklch(81.89% 0.0496 300.23)` | Purple Dragon | black, 11.8 to 1 |
| 2 | `#361d40` | `oklch(27.95% 0.0703 315.03)` | Power Outage | white, 15 to 1 |
| 3 | `#5d5197` | `oklch(48.03% 0.1102 289.67)` | Coronation Blue | white, 6.7 to 1 |
| 4 | `#b987a3` | `oklch(68.11% 0.0703 344.62)` | A Plum Job | black, 7 to 1 |

## CSS

```css
background: linear-gradient(90deg, #c8bde0 0.000% 25.000%, #361d40 25.000% 50.000%, #5d5197 50.000% 75.000%, #b987a3 75.000% 100.000%);
background: linear-gradient(90deg, oklch(81.89% 0.0496 300.23) 0.000% 25.000%, oklch(27.95% 0.0703 315.03) 25.000% 50.000%, oklch(48.03% 0.1102 289.67) 50.000% 75.000%, oklch(68.11% 0.0703 344.62) 75.000% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.819 | 0.05 | 300.2 |
| 2 | 0.28 | 0.07 | 315 |
| 3 | 0.48 | 0.11 | 289.7 |
| 4 | 0.681 | 0.07 | 344.6 |

## In these collections

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

## Other forms

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