# Pale lavender and deep cyan analogous

The Pale lavender and deep cyan analogous brings together pale purple, light blue, blue, and dark blue. The colors span a broad lightness range, combining strong color with clear contrast. Its bold and dramatic character suits travel posters and environmental mood boards. Its darkest tone is dark blue, and its lightest tone is pale purple.

- Also called: Analogous lavender, blue and navy linear swatches
- Seed: `kW5yzV5K891RBvc_uj3JSC9w`
- Page: https://grabient.com/kW5yzV5K891RBvc_uj3JSC9w?style=linearSwatches&steps=5
- Drawn as: linear swatches, 5 steps, 90 degrees
- Kinds: light to dark, vivid, cool
- Hues: analogous
- Contrast of its darkest and lightest colors: 10.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 | `#e6daff` | `oklch(90.94% 0.0515 300.24)` | Transparent Blue | black, 15.8 to 1 |
| 2 | `#b0b2ff` | `oklch(79.13% 0.1084 282.27)` | Winterspring Lilac | black, 10.6 to 1 |
| 3 | `#5a8cff` | `oklch(66.14% 0.1792 264.30)` | Skinny Jeans | black, 6.6 to 1 |
| 4 | `#0067a8` | `oklch(50.00% 0.1296 246.37)` | Medium Persian Blue | white, 5.9 to 1 |
| 5 | `#003142` | `oklch(29.14% 0.0571 228.49)` | Nordic Noir | white, 13.8 to 1 |

## CSS

```css
background: linear-gradient(90deg, #e6daff 0.000% 20.000%, #b0b2ff 20.000% 40.000%, #5a8cff 40.000% 60.000%, #0067a8 60.000% 80.000%, #003142 80.000% 100.000%);
background: linear-gradient(90deg, oklch(90.94% 0.0515 300.24) 0.000% 20.000%, oklch(79.13% 0.1084 282.27) 20.000% 40.000%, oklch(66.14% 0.1792 264.30) 40.000% 60.000%, oklch(50.00% 0.1296 246.37) 60.000% 80.000%, oklch(29.14% 0.0571 228.49) 80.000% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.909 | 0.061 | 300.2 |
| 2 | 0.791 | 0.13 | 282.3 |
| 3 | 0.661 | 0.181 | 264.3 |
| 4 | 0.5 | 0.16 | 246.3 |
| 5 | 0.291 | 0.09 | 228.4 |

## In these collections

- [Analogous swatches](https://grabient.com/analogous-swatches)

## Other forms

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