# Navy, purple, blue and lime green linear gradient

Navy, purple, blue and lime green linear gradient with 32 colors: #03071b, #04081f, #050a25, #060d2b, #080f32, #0b123a, #0f1643, #13194d, #181d56, #1c2060, #22246b, #282875, #302b7f, #3a2e8a, #463094, #52339e, #5d35a9, #6939b3, #723ebf, #7846cd, #7a4fdc, #755ded, #646ffe, #4488ff, #00a1f7, #00b5e4, #00c6d7, #00d6c8, #00e6af, #46f286, #8ff466, #b6f44d. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kUIyG-KCzA8jLQXxySzg`
- Page: https://grabient.com/kUIyG-KCzA8jLQXxySzg?steps=32
- Drawn as: linear gradient, 32 steps, 90 degrees
- Kinds: dark to light, cool
- Hues: split-complementary
- Contrast of its darkest and lightest colors: 15.2 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 | `#03071b` | `oklch(13.78% 0.0455 267.19)` | Melanophobia | white, 20 to 1 |
| 2 | `#04081f` | `oklch(14.76% 0.0499 267.65)` | Melanophobia | white, 19.7 to 1 |
| 3 | `#050a25` | `oklch(15.97% 0.0554 268.23)` | Mysterious Depths | white, 19.5 to 1 |
| 4 | `#060d2b` | `oklch(17.39% 0.0620 268.90)` | Void | white, 19.1 to 1 |
| 5 | `#080f32` | `oklch(18.99% 0.0694 269.65)` | Infinite Night | white, 18.6 to 1 |
| 6 | `#0b123a` | `oklch(20.73% 0.0774 270.48)` | Grim Reaper | white, 18 to 1 |
| 7 | `#0f1643` | `oklch(22.61% 0.0859 271.37)` | Deadly Depths | white, 17.3 to 1 |
| 8 | `#13194d` | `oklch(24.57% 0.0945 272.30)` | Tetsu-Kon Blue | white, 16.4 to 1 |
| 9 | `#181d56` | `oklch(26.61% 0.1032 273.28)` | Dark Soul | white, 15.6 to 1 |
| 10 | `#1c2060` | `oklch(28.70% 0.1118 274.28)` | Intergalactic Cowboy | white, 14.6 to 1 |
| 11 | `#22246b` | `oklch(30.80% 0.1200 275.30)` | After Work Blue | white, 13.7 to 1 |
| 12 | `#282875` | `oklch(32.91% 0.1280 276.68)` | St. Patrick’s Blue | white, 12.7 to 1 |
| 13 | `#302b7f` | `oklch(35.10% 0.1368 279.34)` | Cosmic Cobalt | white, 11.7 to 1 |
| 14 | `#3a2e8a` | `oklch(37.38% 0.1461 282.90)` | Perfect Dark | white, 10.8 to 1 |
| 15 | `#463094` | `oklch(39.72% 0.1556 286.87)` | Galactic Purple | white, 9.9 to 1 |
| 16 | `#52339e` | `oklch(42.14% 0.1651 290.77)` | Blue Magenta Violet | white, 9 to 1 |
| 17 | `#5d35a9` | `oklch(44.63% 0.1744 294.13)` | Royalty | white, 8.2 to 1 |
| 18 | `#6939b3` | `oklch(47.19% 0.1832 296.45)` | Purple Emperor | white, 7.3 to 1 |
| 19 | `#723ebf` | `oklch(49.81% 0.1912 297.26)` | Purple Rain | white, 6.6 to 1 |
| 20 | `#7846cd` | `oklch(52.49% 0.1981 296.06)` | Purple Rain | white, 5.9 to 1 |
| 21 | `#7a4fdc` | `oklch(55.23% 0.2038 292.39)` | Aconite Purple | white, 5.2 to 1 |
| 22 | `#755ded` | `oklch(58.04% 0.2079 285.68)` | Candy Grape Fizz | white, 4.6 to 1 |
| 23 | `#646ffe` | `oklch(61.16% 0.2103 274.91)` | Blue Genie | black, 5.2 to 1 |
| 24 | `#4488ff` | `oklch(64.56% 0.1896 260.61)` | Bleuchâtel Blue | black, 6.2 to 1 |
| 25 | `#00a1f7` | `oklch(68.15% 0.1670 243.68)` | Rockman Blue | black, 7.4 to 1 |
| 26 | `#00b5e4` | `oklch(71.80% 0.1361 225.02)` | Blue Atoll | black, 8.6 to 1 |
| 27 | `#00c6d7` | `oklch(75.43% 0.1289 205.54)` | The Crowd Roars! | black, 10 to 1 |
| 28 | `#00d6c8` | `oklch(78.91% 0.1383 186.15)` | Turquoise Panic | black, 11.4 to 1 |
| 29 | `#00e6af` | `oklch(82.16% 0.1668 167.77)` | Overchlorinated Pool | black, 12.9 to 1 |
| 30 | `#46f286` | `oklch(85.05% 0.2033 151.29)` | Emerald Ice Palace | black, 14.3 to 1 |
| 31 | `#8ff466` | `oklch(87.49% 0.2019 137.63)` | Stadium Lawn | black, 15.2 to 1 |
| 32 | `#b6f44d` | `oklch(89.37% 0.2012 127.70)` | Pick Your Poison | black, 15.9 to 1 |

## CSS

```css
background: linear-gradient(90deg, #03071b 0.0%, #04081f 3.2%, #050a25 6.5%, #060d2b 9.7%, #080f32 12.9%, #0b123a 16.1%, #0f1643 19.4%, #13194d 22.6%, #181d56 25.8%, #1c2060 29.0%, #22246b 32.3%, #282875 35.5%, #302b7f 38.7%, #3a2e8a 41.9%, #463094 45.2%, #52339e 48.4%, #5d35a9 51.6%, #6939b3 54.8%, #723ebf 58.1%, #7846cd 61.3%, #7a4fdc 64.5%, #755ded 67.7%, #646ffe 71.0%, #4488ff 74.2%, #00a1f7 77.4%, #00b5e4 80.6%, #00c6d7 83.9%, #00d6c8 87.1%, #00e6af 90.3%, #46f286 93.5%, #8ff466 96.8%, #b6f44d 100.0%);
background: linear-gradient(90deg in oklch, oklch(13.78% 0.0455 267.19) 0.0%, oklch(14.76% 0.0499 267.65) 3.2%, oklch(15.97% 0.0554 268.23) 6.5%, oklch(17.39% 0.0620 268.90) 9.7%, oklch(18.99% 0.0694 269.65) 12.9%, oklch(20.73% 0.0774 270.48) 16.1%, oklch(22.61% 0.0859 271.37) 19.4%, oklch(24.57% 0.0945 272.30) 22.6%, oklch(26.61% 0.1032 273.28) 25.8%, oklch(28.70% 0.1118 274.28) 29.0%, oklch(30.80% 0.1200 275.30) 32.3%, oklch(32.91% 0.1280 276.68) 35.5%, oklch(35.10% 0.1368 279.34) 38.7%, oklch(37.38% 0.1461 282.90) 41.9%, oklch(39.72% 0.1556 286.87) 45.2%, oklch(42.14% 0.1651 290.77) 48.4%, oklch(44.63% 0.1744 294.13) 51.6%, oklch(47.19% 0.1832 296.45) 54.8%, oklch(49.81% 0.1912 297.26) 58.1%, oklch(52.49% 0.1981 296.06) 61.3%, oklch(55.23% 0.2038 292.39) 64.5%, oklch(58.04% 0.2079 285.68) 67.7%, oklch(61.16% 0.2103 274.91) 71.0%, oklch(64.56% 0.1896 260.61) 74.2%, oklch(68.15% 0.1670 243.68) 77.4%, oklch(71.80% 0.1361 225.02) 80.6%, oklch(75.43% 0.1289 205.54) 83.9%, oklch(78.91% 0.1383 186.15) 87.1%, oklch(82.16% 0.1668 167.77) 90.3%, oklch(85.05% 0.2033 151.29) 93.5%, oklch(87.49% 0.2019 137.63) 96.8%, oklch(89.37% 0.2012 127.70) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.138 | 0.045 | 267.2 |
| 2 | 0.315 | 0.123 | 275.6 |
| 3 | 0.571 | 0.207 | 288.3 |
| 4 | 0.894 | 0.201 | 127.7 |

## In these collections

- [Black Friday gradients](https://grabient.com/black-friday-gradients)

## Other forms

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