# Navy, violet and turquoise color palette

The Navy, violet and turquoise color 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 fashion mood boards and lookbook graphics. Its darkest tone is dark blue, and its lightest tone is teal.

- Also called: Navy, purple and blue linear gradient
- Seed: `kWMDnIONJAEbbwfPwrp5jA5Q`
- Page: https://grabient.com/kWMDnIONJAEbbwfPwrp5jA5Q?steps=32&angle=135
- Drawn as: linear gradient, 32 steps, 135 degrees
- Kinds: dark to light, vivid, cool
- Hues: wide
- Contrast of its darkest and lightest colors: 10.6 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 | `#100b35` | `oklch(18.90% 0.0785 281.25)` | Grim Reaper | white, 18.7 to 1 |
| 2 | `#140d40` | `oklch(21.05% 0.0912 281.22)` | Deadly Depths | white, 18 to 1 |
| 3 | `#1a1150` | `oklch(24.04% 0.1091 281.06)` | Indigo Sloth | white, 16.9 to 1 |
| 4 | `#221565` | `oklch(27.61% 0.1305 280.85)` | Ocean Abyss | white, 15.4 to 1 |
| 5 | `#2a1a7b` | `oklch(31.50% 0.1535 280.71)` | Blue Royale | white, 13.7 to 1 |
| 6 | `#331e93` | `oklch(35.44% 0.1766 280.72)` | Gentian Blue | white, 11.9 to 1 |
| 7 | `#3d23aa` | `oklch(39.19% 0.1980 280.97)` | Indigo Blue | white, 10.4 to 1 |
| 8 | `#4627be` | `oklch(42.48% 0.2159 281.57)` | Blue Depression | white, 9.1 to 1 |
| 9 | `#4f29cd` | `oklch(45.07% 0.2287 282.64)` | Blue Purple | white, 8.2 to 1 |
| 10 | `#592bd7` | `oklch(47.14% 0.2381 284.83)` | Blue Purple | white, 7.6 to 1 |
| 11 | `#642adf` | `oklch(48.87% 0.2453 287.95)` | Burple | white, 7.1 to 1 |
| 12 | `#6f29e3` | `oklch(50.34% 0.2504 291.51)` | Burple | white, 6.7 to 1 |
| 13 | `#7a28e5` | `oklch(51.62% 0.2536 295.00)` | Hokkaido Lavender | white, 6.4 to 1 |
| 14 | `#8329e7` | `oklch(52.76% 0.2550 297.89)` | Bright Blue Violet | white, 6.1 to 1 |
| 15 | `#892ce8` | `oklch(53.85% 0.2549 299.69)` | Bright Blue Violet | white, 5.8 to 1 |
| 16 | `#8c32eb` | `oklch(54.94% 0.2534 299.88)` | Bright Blue Violet | white, 5.5 to 1 |
| 17 | `#8c3af0` | `oklch(56.06% 0.2504 298.02)` | Sugar Grape | white, 5.2 to 1 |
| 18 | `#8644f5` | `oklch(56.97% 0.2445 294.35)` | Sweet Escape | white, 5 to 1 |
| 19 | `#7d4ff8` | `oklch(57.71% 0.2363 289.24)` | Venetian Nights | white, 4.8 to 1 |
| 20 | `#715bfa` | `oklch(58.39% 0.2265 283.05)` | Venetian Nights | white, 4.6 to 1 |
| 21 | `#6166fa` | `oklch(59.08% 0.2157 276.13)` | Blue Genie | black, 4.7 to 1 |
| 22 | `#4f71f8` | `oklch(59.88% 0.2048 268.81)` | Blue Öyster Cult | black, 5 to 1 |
| 23 | `#3a7cf5` | `oklch(60.90% 0.1944 261.45)` | Lightish Blue | black, 5.3 to 1 |
| 24 | `#2086f2` | `oklch(62.21% 0.1853 254.39)` | Pool Water | black, 5.7 to 1 |
| 25 | `#0091ec` | `oklch(63.97% 0.1700 247.45)` | Bleu de France | black, 6.2 to 1 |
| 26 | `#009de5` | `oklch(66.23% 0.1507 239.62)` | Homeworld | black, 6.9 to 1 |
| 27 | `#00a9e1` | `oklch(68.82% 0.1392 231.28)` | Blue Fire | black, 7.7 to 1 |
| 28 | `#00b4df` | `oklch(71.56% 0.1331 222.85)` | Blue Atoll | black, 8.6 to 1 |
| 29 | `#00c0df` | `oklch(74.26% 0.1310 214.76)` | Caribbean Blue | black, 9.5 to 1 |
| 30 | `#00cade` | `oklch(76.74% 0.1317 207.42)` | Picnic Day Sky | black, 10.5 to 1 |
| 31 | `#00d3dd` | `oklch(78.82% 0.1340 201.27)` | Aztec Turquoise | black, 11.3 to 1 |
| 32 | `#22d8db` | `oklch(80.31% 0.1323 196.71)` | Fish Boy | black, 11.9 to 1 |

## CSS

```css
background: linear-gradient(135deg, #100b35 0.0%, #140d40 3.2%, #1a1150 6.5%, #221565 9.7%, #2a1a7b 12.9%, #331e93 16.1%, #3d23aa 19.4%, #4627be 22.6%, #4f29cd 25.8%, #592bd7 29.0%, #642adf 32.3%, #6f29e3 35.5%, #7a28e5 38.7%, #8329e7 41.9%, #892ce8 45.2%, #8c32eb 48.4%, #8c3af0 51.6%, #8644f5 54.8%, #7d4ff8 58.1%, #715bfa 61.3%, #6166fa 64.5%, #4f71f8 67.7%, #3a7cf5 71.0%, #2086f2 74.2%, #0091ec 77.4%, #009de5 80.6%, #00a9e1 83.9%, #00b4df 87.1%, #00c0df 90.3%, #00cade 93.5%, #00d3dd 96.8%, #22d8db 100.0%);
background: linear-gradient(135deg in oklch, oklch(18.90% 0.0785 281.25) 0.0%, oklch(21.05% 0.0912 281.22) 3.2%, oklch(24.04% 0.1091 281.06) 6.5%, oklch(27.61% 0.1305 280.85) 9.7%, oklch(31.50% 0.1535 280.71) 12.9%, oklch(35.44% 0.1766 280.72) 16.1%, oklch(39.19% 0.1980 280.97) 19.4%, oklch(42.48% 0.2159 281.57) 22.6%, oklch(45.07% 0.2287 282.64) 25.8%, oklch(47.14% 0.2381 284.83) 29.0%, oklch(48.87% 0.2453 287.95) 32.3%, oklch(50.34% 0.2504 291.51) 35.5%, oklch(51.62% 0.2536 295.00) 38.7%, oklch(52.76% 0.2550 297.89) 41.9%, oklch(53.85% 0.2549 299.69) 45.2%, oklch(54.94% 0.2534 299.88) 48.4%, oklch(56.06% 0.2504 298.02) 51.6%, oklch(56.97% 0.2445 294.35) 54.8%, oklch(57.71% 0.2363 289.24) 58.1%, oklch(58.39% 0.2265 283.05) 61.3%, oklch(59.08% 0.2157 276.13) 64.5%, oklch(59.88% 0.2048 268.81) 67.7%, oklch(60.90% 0.1944 261.45) 71.0%, oklch(62.21% 0.1853 254.39) 74.2%, oklch(63.97% 0.1700 247.45) 77.4%, oklch(66.23% 0.1507 239.62) 80.6%, oklch(68.82% 0.1392 231.28) 83.9%, oklch(71.56% 0.1331 222.85) 87.1%, oklch(74.26% 0.1310 214.76) 90.3%, oklch(76.74% 0.1317 207.42) 93.5%, oklch(78.82% 0.1340 201.27) 96.8%, oklch(80.31% 0.1323 196.71) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.189 | 0.079 | 281.3 |
| 2 | 0.445 | 0.226 | 282.3 |
| 3 | 0.555 | 0.252 | 299.2 |
| 4 | 0.626 | 0.183 | 252.7 |
| 5 | 0.803 | 0.132 | 196.7 |

## In these collections

- [Sequined feather costume](https://grabient.com/sequined-feather-costume)
- [Blue and purple gradients](https://grabient.com/blue-and-purple-gradients)
- [Aurora gradients](https://grabient.com/aurora-gradients)

## Other forms

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