# Pale periwinkle and pale lavender color palette

The Pale periwinkle and pale lavender color palette brings together pale purple, light purple, and pale magenta. The colors span a narrow lightness range, combining restrained color with gentle contrast. Its light and open character suits brand mood boards and editorial graphics. Its darkest tone is light purple, and its lightest tone is pale purple.

- Also called: Pastel monochrome lavender angular swatches
- Seed: `kS5x_Ta5hBfCTQm`
- Page: https://grabient.com/kS5x_Ta5hBfCTQm?style=angularSwatches&steps=5&angle=135
- Drawn as: angular swatches, 5 steps, 135 degrees
- Kinds: even lightness, pastel, light, monochrome
- Hues: analogous
- Contrast of its darkest and lightest colors: 1.2 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 | `#e3dcfb` | `oklch(90.94% 0.0427 296.72)` | Contrail | black, 15.8 to 1 |
| 2 | `#dccef5` | `oklch(87.55% 0.0553 301.74)` | Pale Lavender | black, 14.2 to 1 |
| 3 | `#dac1ee` | `oklch(84.65% 0.0661 309.40)` | Beefy Pink | black, 12.8 to 1 |
| 4 | `#e4c5eb` | `oklch(86.22% 0.0607 320.76)` | Prom Corsage | black, 13.5 to 1 |
| 5 | `#eecdea` | `oklch(88.58% 0.0524 330.53)` | Poodle Pink | black, 14.6 to 1 |

## CSS

```css
background: conic-gradient(from 135deg, #e3dcfb 0.000% 20.000%, #dccef5 20.000% 40.000%, #dac1ee 40.000% 60.000%, #e4c5eb 60.000% 80.000%, #eecdea 80.000% 100.000%);
background: conic-gradient(from 135deg, oklch(90.94% 0.0427 296.72) 0.000% 20.000%, oklch(87.55% 0.0553 301.74) 20.000% 40.000%, oklch(84.65% 0.0661 309.40) 40.000% 60.000%, oklch(86.22% 0.0607 320.76) 60.000% 80.000%, oklch(88.58% 0.0524 330.53) 80.000% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.909 | 0.043 | 296.7 |
| 2 | 0.846 | 0.066 | 309.4 |
| 3 | 0.886 | 0.052 | 330.5 |

## In these collections

- [Pastel swatches](https://grabient.com/pastel-swatches)
- [Calm swatches](https://grabient.com/calm-swatches)
- [Dusty swatches](https://grabient.com/dusty-swatches)

## Other forms

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