# Navy, gray, tan and purple radial gradient

Navy, gray, tan and purple radial gradient with 32 colors: #151d48, #1d2e58, #2b4871, #3d678d, #5287a8, #68a4bf, #7ab7ce, #83bdd2, #86bacb, #84b0c0, #80a4b2, #7b97a5, #778d9d, #78879b, #7c819a, #867996, #92738b, #9c6f7b, #a2706c, #a77564, #b18165, #bd906c, #caa076, #d7ac81, #dfb188, #dfac8b, #d3998b, #b8818b, #906987, #64567a, #404667, #283b56. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kYQDrBX5m6U-MwnMmNGZBvCiyTrQ`
- Page: https://grabient.com/kYQDrBX5m6U-MwnMmNGZBvCiyTrQ?style=radialGradient&steps=32&angle=0
- Drawn as: radial gradient, 32 steps, 0 degrees
- Kinds: light center, muted
- Hues: complementary
- Contrast of its darkest and lightest colors: 8.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 | `#151d48` | `oklch(25.20% 0.0799 271.41)` | Konkikyō Blue | white, 16.1 to 1 |
| 2 | `#1d2e58` | `oklch(31.11% 0.0792 265.68)` | Ending Navy Blue | white, 13.2 to 1 |
| 3 | `#2b4871` | `oklch(39.83% 0.0784 257.17)` | Enchanted Navy | white, 9.3 to 1 |
| 4 | `#3d678d` | `oklch(49.95% 0.0775 247.31)` | French Mirage Blue | white, 5.9 to 1 |
| 5 | `#5287a8` | `oklch(60.05% 0.0760 237.59)` | Safe Haven | black, 5.4 to 1 |
| 6 | `#68a4bf` | `oklch(68.70% 0.0739 229.45)` | Air Blue | black, 7.6 to 1 |
| 7 | `#7ab7ce` | `oklch(74.50% 0.0710 224.37)` | Blue Chrysocolla | black, 9.4 to 1 |
| 8 | `#83bdd2` | `oklch(76.56% 0.0664 222.29)` | Juvie | black, 10.1 to 1 |
| 9 | `#86bacb` | `oklch(75.81% 0.0597 221.14)` | Blue Bird Morning | black, 9.8 to 1 |
| 10 | `#84b0c0` | `oklch(73.19% 0.0520 221.58)` | Open Seas | black, 8.9 to 1 |
| 11 | `#80a4b2` | `oklch(69.61% 0.0445 224.36)` | Grauzone | black, 7.8 to 1 |
| 12 | `#7b97a5` | `oklch(65.99% 0.0384 230.21)` | Storm Petrel | black, 6.8 to 1 |
| 13 | `#778d9d` | `oklch(63.24% 0.0349 239.88)` | Sheltered Bay | black, 6 to 1 |
| 14 | `#78879b` | `oklch(61.88% 0.0350 254.90)` | Somnambulist | black, 5.7 to 1 |
| 15 | `#7c819a` | `oklch(60.75% 0.0387 277.49)` | Tempest | black, 5.4 to 1 |
| 16 | `#867996` | `oklch(59.82% 0.0447 304.91)` | Relic | black, 5.1 to 1 |
| 17 | `#92738b` | `oklch(59.23% 0.0519 333.94)` | Very Grape | black, 5 to 1 |
| 18 | `#9c6f7b` | `oklch(59.11% 0.0590 1.39)` | Concerto | black, 4.9 to 1 |
| 19 | `#a2706c` | `oklch(59.60% 0.0650 24.03)` | Warm Wassail | black, 5 to 1 |
| 20 | `#a77564` | `oklch(60.96% 0.0688 39.35)` | Chutney Brown | black, 5.3 to 1 |
| 21 | `#b18165` | `oklch(64.23% 0.0717 51.17)` | Cider Spice | black, 6.1 to 1 |
| 22 | `#bd906c` | `oklch(68.74% 0.0739 60.15)` | Sunset Cloud | black, 7.3 to 1 |
| 23 | `#caa076` | `oklch(73.44% 0.0755 65.59)` | Pumpkin Butter | black, 8.7 to 1 |
| 24 | `#d7ac81` | `oklch(77.29% 0.0763 66.82)` | Paper Brown | black, 10.1 to 1 |
| 25 | `#dfb188` | `oklch(79.25% 0.0764 63.13)` | Soft Skills | black, 10.7 to 1 |
| 26 | `#dfac8b` | `oklch(78.25% 0.0755 53.70)` | New Mexico Mesa | black, 10.3 to 1 |
| 27 | `#d3998b` | `oklch(73.54% 0.0731 34.33)` | Nectarine Spice | black, 8.7 to 1 |
| 28 | `#b8818b` | `oklch(66.05% 0.0693 6.50)` | Lime Pink | black, 6.5 to 1 |
| 29 | `#906987` | `oklch(57.13% 0.0648 334.52)` | Fruit of Passion | white, 4.5 to 1 |
| 30 | `#64567a` | `oklch(48.09% 0.0603 302.68)` | Regal Gown | white, 6.6 to 1 |
| 31 | `#404667` | `oklch(40.29% 0.0564 275.28)` | Blue Wonder | white, 9.1 to 1 |
| 32 | `#283b56` | `oklch(35.04% 0.0537 256.61)` | Nautilus | white, 11.2 to 1 |

## CSS

```css
background: radial-gradient(circle at 50% 50%, #151d48 0.0%, #1d2e58 3.2%, #2b4871 6.5%, #3d678d 9.7%, #5287a8 12.9%, #68a4bf 16.1%, #7ab7ce 19.4%, #83bdd2 22.6%, #86bacb 25.8%, #84b0c0 29.0%, #80a4b2 32.3%, #7b97a5 35.5%, #778d9d 38.7%, #78879b 41.9%, #7c819a 45.2%, #867996 48.4%, #92738b 51.6%, #9c6f7b 54.8%, #a2706c 58.1%, #a77564 61.3%, #b18165 64.5%, #bd906c 67.7%, #caa076 71.0%, #d7ac81 74.2%, #dfb188 77.4%, #dfac8b 80.6%, #d3998b 83.9%, #b8818b 87.1%, #906987 90.3%, #64567a 93.5%, #404667 96.8%, #283b56 100.0%);
background: radial-gradient(circle at 50% 50% in oklch, oklch(25.20% 0.0799 271.41) 0.0%, oklch(31.11% 0.0792 265.68) 3.2%, oklch(39.83% 0.0784 257.17) 6.5%, oklch(49.95% 0.0775 247.31) 9.7%, oklch(60.05% 0.0760 237.59) 12.9%, oklch(68.70% 0.0739 229.45) 16.1%, oklch(74.50% 0.0710 224.37) 19.4%, oklch(76.56% 0.0664 222.29) 22.6%, oklch(75.81% 0.0597 221.14) 25.8%, oklch(73.19% 0.0520 221.58) 29.0%, oklch(69.61% 0.0445 224.36) 32.3%, oklch(65.99% 0.0384 230.21) 35.5%, oklch(63.24% 0.0349 239.88) 38.7%, oklch(61.88% 0.0350 254.90) 41.9%, oklch(60.75% 0.0387 277.49) 45.2%, oklch(59.82% 0.0447 304.91) 48.4%, oklch(59.23% 0.0519 333.94) 51.6%, oklch(59.11% 0.0590 1.39) 54.8%, oklch(59.60% 0.0650 24.03) 58.1%, oklch(60.96% 0.0688 39.35) 61.3%, oklch(64.23% 0.0717 51.17) 64.5%, oklch(68.74% 0.0739 60.15) 67.7%, oklch(73.44% 0.0755 65.59) 71.0%, oklch(77.29% 0.0763 66.82) 74.2%, oklch(79.25% 0.0764 63.13) 77.4%, oklch(78.25% 0.0755 53.70) 80.6%, oklch(73.54% 0.0731 34.33) 83.9%, oklch(66.05% 0.0693 6.50) 87.1%, oklch(57.13% 0.0648 334.52) 90.3%, oklch(48.09% 0.0603 302.68) 93.5%, oklch(40.29% 0.0564 275.28) 96.8%, oklch(35.04% 0.0537 256.61) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.252 | 0.08 | 271.4 |
| 2 | 0.752 | 0.07 | 223.9 |
| 3 | 0.626 | 0.034 | 245 |
| 4 | 0.602 | 0.068 | 394 |
| 5 | 0.787 | 0.076 | 416.2 |
| 6 | 0.35 | 0.054 | 256.6 |

## In these collections

- [Dusk gradients](https://grabient.com/dusk-gradients)

## Other forms

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