# Pale mint and pale lilac color palette

The Pale mint and pale lilac color palette brings together pale green, off-white, pale purple, pale magenta, and light magenta. The colors span a narrow lightness range, combining moderate color with gentle contrast. Its light and open character suits seasonal campaigns and event graphics. Its darkest tone is light magenta, and its lightest tone is off-white.

- Also called: Pastel complementary blue and pink linear swatches
- Seed: `kW9yFtfQXG3oKzJ0HMC7i1AI`
- Page: https://grabient.com/kW9yFtfQXG3oKzJ0HMC7i1AI?style=linearSwatches&steps=5
- Drawn as: linear swatches, 5 steps, 90 degrees
- Kinds: even lightness, pastel, light
- Hues: complementary
- Contrast of its darkest and lightest colors: 1.5 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 | `#e1ffe9` | `oklch(97.24% 0.0429 153.29)` | Crystal Glass | black, 19.6 to 1 |
| 2 | `#f0fdff` | `oklch(98.42% 0.0133 211.34)` | Vapour | black, 20.1 to 1 |
| 3 | `#fbecff` | `oklch(96.06% 0.0289 318.13)` | Fairy Bubblegum Cloud | black, 18.5 to 1 |
| 4 | `#fdd2ff` | `oklch(91.34% 0.0757 324.48)` | Pink Diamond | black, 15.8 to 1 |
| 5 | `#feb6fe` | `oklch(86.61% 0.1240 326.59)` | Distilled Rose | black, 13.3 to 1 |

## CSS

```css
background: linear-gradient(90deg, #e1ffe9 0.000% 20.000%, #f0fdff 20.000% 40.000%, #fbecff 40.000% 60.000%, #fdd2ff 60.000% 80.000%, #feb6fe 80.000% 100.000%);
background: linear-gradient(90deg, oklch(97.24% 0.0429 153.29) 0.000% 20.000%, oklch(98.42% 0.0133 211.34) 20.000% 40.000%, oklch(96.06% 0.0289 318.13) 40.000% 60.000%, oklch(91.34% 0.0757 324.48) 60.000% 80.000%, oklch(86.61% 0.1240 326.59) 80.000% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.972 | 0.045 | 153.3 |
| 2 | 0.984 | 0.015 | 211.4 |
| 3 | 0.961 | 0.029 | 318.1 |
| 4 | 0.913 | 0.079 | 324.5 |
| 5 | 0.866 | 0.124 | 326.6 |

## In these collections

- [Spring swatches](https://grabient.com/spring-swatches)
- [Soft swatches](https://grabient.com/soft-swatches)

## Other forms

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