# Navy, magenta and pale aqua color palette

The Navy, magenta and pale aqua color palette brings together dark blue, blue, purple, magenta, green, and pale teal. The colors span a very broad lightness range, combining strong color with high contrast. Its bold and dramatic character suits game interface concepts and stream graphics. Its darkest tone is dark blue, and its lightest tone is pale teal.

- Also called: Rainbow from navy to light blue linear swatches
- Seed: `kYKSi8qi9CUZIxBXwcN5bbUveZwa`
- Page: https://grabient.com/kYKSi8qi9CUZIxBXwcN5bbUveZwa?style=linearSwatches&steps=6
- Drawn as: linear swatches, 6 steps, 90 degrees
- Kinds: dark to light, vivid, rainbow
- Hues: split-complementary
- Contrast of its darkest and lightest colors: 16.7 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 | `#040b25` | `oklch(16.14% 0.0551 265.08)` | Void | white, 19.4 to 1 |
| 2 | `#332474` | `oklch(33.07% 0.1295 285.16)` | Deep Space Rodeo | white, 12.7 to 1 |
| 3 | `#a23db8` | `oklch(55.12% 0.1998 320.03)` | Akebi Purple | white, 5.3 to 1 |
| 4 | `#e964ab` | `oklch(68.90% 0.1805 349.62)` | Fugitive Flamingo | black, 6.8 to 1 |
| 5 | `#40dba5` | `oklch(79.92% 0.1502 165.04)` | Malted Mint Madness | black, 11.9 to 1 |
| 6 | `#b8fced` | `oklch(94.09% 0.0703 179.83)` | Summer Cloud | black, 18.1 to 1 |

## CSS

```css
background: linear-gradient(90deg, #040b25 0.000% 16.667%, #332474 16.667% 33.333%, #a23db8 33.333% 50.000%, #e964ab 50.000% 66.667%, #40dba5 66.667% 83.333%, #b8fced 83.333% 100.000%);
background: linear-gradient(90deg, oklch(16.14% 0.0551 265.08) 0.000% 16.667%, oklch(33.07% 0.1295 285.16) 16.667% 33.333%, oklch(55.12% 0.1998 320.03) 33.333% 50.000%, oklch(68.90% 0.1805 349.62) 50.000% 66.667%, oklch(79.92% 0.1502 165.04) 66.667% 83.333%, oklch(94.09% 0.0703 179.83) 83.333% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.161 | 0.055 | 265.1 |
| 2 | 0.331 | 0.13 | 285.2 |
| 3 | 0.551 | 0.2 | 320 |
| 4 | 0.689 | 0.181 | 349.6 |
| 5 | 0.799 | 0.15 | 525 |
| 6 | 0.941 | 0.07 | 539.8 |

## In these collections

- [Neon swatches](https://grabient.com/neon-swatches)
- [Cyberpunk swatches](https://grabient.com/cyberpunk-swatches)
- [Aurora swatches](https://grabient.com/aurora-swatches)

## Other forms

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