# Navy, violet and teal aurora palette

The Navy, violet and teal aurora palette brings together dark blue, blue, purple, and teal. The colors span a broad lightness range, combining strong color with clear contrast. Its bold and dramatic character suits brand mood boards and editorial graphics. Its darkest tone is dark blue, and its lightest tone is teal.

- Also called: Cool navy, purple and teal linear swatches
- Seed: `kWMie6LCbCD49wbIorNZKu_o`
- Page: https://grabient.com/kWMie6LCbCD49wbIorNZKu_o?style=linearSwatches&steps=5
- Drawn as: linear swatches, 5 steps, 90 degrees
- Kinds: dark to light, cool
- Hues: two-hue
- Contrast of its darkest and lightest colors: 9.9 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 | `#07142d` | `oklch(19.69% 0.0537 261.56)` | Squid’s Ink | white, 18.2 to 1 |
| 2 | `#30306f` | `oklch(34.65% 0.1061 279.53)` | Blue Rose | white, 11.8 to 1 |
| 3 | `#6944b4` | `oklch(48.82% 0.1695 294.32)` | Swiss Plum | white, 6.8 to 1 |
| 4 | `#158982` | `oklch(57.09% 0.0951 187.59)` | Clear Turquoise | black, 4.9 to 1 |
| 5 | `#48d4c6` | `oklch(79.13% 0.1199 185.48)` | Turquoise Panic | black, 11.4 to 1 |

## CSS

```css
background: linear-gradient(90deg, #07142d 0.000% 20.000%, #30306f 20.000% 40.000%, #6944b4 40.000% 60.000%, #158982 60.000% 80.000%, #48d4c6 80.000% 100.000%);
background: linear-gradient(90deg, oklch(19.69% 0.0537 261.56) 0.000% 20.000%, oklch(34.65% 0.1061 279.53) 20.000% 40.000%, oklch(48.82% 0.1695 294.32) 40.000% 60.000%, oklch(57.09% 0.0951 187.59) 60.000% 80.000%, oklch(79.13% 0.1199 185.48) 80.000% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.197 | 0.054 | 261.6 |
| 2 | 0.346 | 0.106 | 279.5 |
| 3 | 0.488 | 0.169 | 294.3 |
| 4 | 0.571 | 0.095 | 187.6 |
| 5 | 0.791 | 0.12 | 185.5 |

## In these collections

- [Aurora swatches](https://grabient.com/aurora-swatches)

## Other forms

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