# Navy and pale lavender analogous palette

The Navy and pale lavender analogous palette brings together blue, light blue, light purple, and magenta. The colors span a broad lightness range, combining strong color with clear contrast. Its bold and dramatic character suits brand mood boards and campaign graphics. Its darkest tone is blue, and its lightest tone is light purple.

- Also called: Vivid blue, lavender and purple linear swatches
- Seed: `kUWn-84CnCueiQmzvELg`
- Page: https://grabient.com/kUWn-84CnCueiQmzvELg?style=linearSwatches&steps=4&angle=45
- Drawn as: linear swatches, 4 steps, 45 degrees
- Kinds: light center, vivid
- Hues: analogous
- Contrast of its darkest and lightest colors: 6.3 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 | `#0d2b95` | `oklch(35.43% 0.1750 265.08)` | Blue Torus | white, 11.7 to 1 |
| 2 | `#ada4f4` | `oklch(75.59% 0.1144 288.33)` | Shy Moment | black, 9.3 to 1 |
| 3 | `#d5b2f1` | `oklch(81.50% 0.0937 309.46)` | Light Violet | black, 11.4 to 1 |
| 4 | `#7a126c` | `oklch(40.55% 0.1654 334.82)` | Purple Curse | white, 9.8 to 1 |

## CSS

```css
background: linear-gradient(45deg, #0d2b95 0.000% 25.000%, #ada4f4 25.000% 50.000%, #d5b2f1 50.000% 75.000%, #7a126c 75.000% 100.000%);
background: linear-gradient(45deg, oklch(35.43% 0.1750 265.08) 0.000% 25.000%, oklch(75.59% 0.1144 288.33) 25.000% 50.000%, oklch(81.50% 0.0937 309.46) 50.000% 75.000%, oklch(40.55% 0.1654 334.82) 75.000% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.354 | 0.175 | 265.1 |
| 2 | 0.756 | 0.114 | 288.3 |
| 3 | 0.815 | 0.094 | 309.5 |
| 4 | 0.406 | 0.165 | 334.8 |

## In these collections

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

## Other forms

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