# Island sunset after rain

Vivid navy, purple, magenta and orange radial gradient with 48 colors: #1d124c, #20134f, #241352, #281456, #2d155b, #33165f, #391664, #3f1769, #47176d, #4e1871, #561875, #5f1878, #67187b, #6f187d, #78187f, #801880, #881980, #8f1a80, #971a80, #9f1b7f, #a71c7d, #af1e7c, #b71f79, #bf2277, #c72474, #ce2870, #d52b6d, #dc2f69, #e23464, #e83960, #ee3e5b, #f34456, #f74a51, #fb514c, #fe5846, #ff6344, #ff6d44, #ff7645, #ff7e46, #ff8647, #ff8e49, #ff944c, #ff9b4e, #ffa051, #ffa554, #ffaa56, #ffae59, #ffb15b. Edit it and copy or download CSS, SVG, PNG or shader code.

- Also called: Vivid navy, purple, magenta and orange radial gradient
- Seed: `kUPUnKuEHFVLMRfoOkVA`
- Page: https://grabient.com/kUPUnKuEHFVLMRfoOkVA?style=radialGradient&steps=48&angle=180
- Drawn as: radial gradient, 48 steps, 180 degrees
- Kinds: dark to light, vivid
- Hues: wide
- Contrast of its darkest and lightest colors: 9.3 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 | `#1d124c` | `oklch(24.02% 0.1006 284.77)` | Tetsu-Kon Blue | white, 16.8 to 1 |
| 2 | `#20134f` | `oklch(24.73% 0.1036 286.38)` | Praise of Shadow | white, 16.6 to 1 |
| 3 | `#241352` | `oklch(25.60% 0.1073 288.32)` | Praise of Shadow | white, 16.2 to 1 |
| 4 | `#281456` | `oklch(26.59% 0.1116 290.54)` | Praise of Shadow | white, 15.8 to 1 |
| 5 | `#2d155b` | `oklch(27.70% 0.1166 293.02)` | Voldemort | white, 15.3 to 1 |
| 6 | `#33165f` | `oklch(28.91% 0.1220 295.72)` | Fabric of Space | white, 14.8 to 1 |
| 7 | `#391664` | `oklch(30.21% 0.1277 298.62)` | Candied Blueberry | white, 14.2 to 1 |
| 8 | `#3f1769` | `oklch(31.57% 0.1337 301.67)` | Obsidian Shell | white, 13.6 to 1 |
| 9 | `#47176d` | `oklch(32.99% 0.1398 304.85)` | Obsidian Shell | white, 13 to 1 |
| 10 | `#4e1871` | `oklch(34.45% 0.1459 308.14)` | Velvet Vortex | white, 12.4 to 1 |
| 11 | `#561875` | `oklch(35.94% 0.1520 311.48)` | Velvet Vortex | white, 11.7 to 1 |
| 12 | `#5f1878` | `oklch(37.43% 0.1580 314.87)` | Deep Daitoku Purple | white, 11.1 to 1 |
| 13 | `#67187b` | `oklch(38.92% 0.1636 318.25)` | Deep Daitoku Purple | white, 10.5 to 1 |
| 14 | `#6f187d` | `oklch(40.39% 0.1689 321.62)` | Pure Purple | white, 9.9 to 1 |
| 15 | `#78187f` | `oklch(41.82% 0.1738 324.92)` | Count’s Wardrobe | white, 9.3 to 1 |
| 16 | `#801880` | `oklch(43.21% 0.1780 328.13)` | Hello Darkness My Old Friend | white, 8.8 to 1 |
| 17 | `#881980` | `oklch(44.53% 0.1817 331.23)` | Royal Purpleness | white, 8.4 to 1 |
| 18 | `#8f1a80` | `oklch(45.86% 0.1851 334.35)` | Noble Plum | white, 7.9 to 1 |
| 19 | `#971a80` | `oklch(47.20% 0.1883 337.53)` | Haunted Purple | white, 7.5 to 1 |
| 20 | `#9f1b7f` | `oklch(48.55% 0.1914 340.74)` | Haunted Purple | white, 7.1 to 1 |
| 21 | `#a71c7d` | `oklch(49.92% 0.1944 344.00)` | Fabric of Love | white, 6.7 to 1 |
| 22 | `#af1e7c` | `oklch(51.29% 0.1971 347.28)` | King’s Plum Pie | white, 6.3 to 1 |
| 23 | `#b71f79` | `oklch(52.66% 0.1997 350.59)` | Treasured Love | white, 5.9 to 1 |
| 24 | `#bf2277` | `oklch(54.04% 0.2020 353.91)` | Treasured Love | white, 5.6 to 1 |
| 25 | `#c72474` | `oklch(55.41% 0.2041 357.23)` | Prince Charming | white, 5.3 to 1 |
| 26 | `#ce2870` | `oklch(56.77% 0.2059 0.55)` | Pink Peacock | white, 5 to 1 |
| 27 | `#d52b6d` | `oklch(58.12% 0.2074 3.85)` | Self-Love | white, 4.7 to 1 |
| 28 | `#dc2f69` | `oklch(59.45% 0.2085 7.14)` | 1989 Miami Hotline | black, 4.6 to 1 |
| 29 | `#e23464` | `oklch(60.77% 0.2094 10.39)` | Intense Passion | black, 4.9 to 1 |
| 30 | `#e83960` | `oklch(62.06% 0.2099 13.61)` | Eugenia Red | black, 5.1 to 1 |
| 31 | `#ee3e5b` | `oklch(63.32% 0.2100 16.78)` | Clown Nose | black, 5.4 to 1 |
| 32 | `#f34456` | `oklch(64.56% 0.2096 19.90)` | Vineyard Autumn | black, 5.7 to 1 |
| 33 | `#f74a51` | `oklch(65.77% 0.2088 23.01)` | Pumping Spice | black, 6 to 1 |
| 34 | `#fb514c` | `oklch(67.01% 0.2073 26.22)` | Tart Orange | black, 6.3 to 1 |
| 35 | `#fe5846` | `oklch(68.28% 0.2050 29.52)` | Red Orange Juice | black, 6.7 to 1 |
| 36 | `#ff6344` | `oklch(69.55% 0.1964 32.88)` | Sweet Pimento | black, 7.1 to 1 |
| 37 | `#ff6d44` | `oklch(70.82% 0.1874 36.27)` | Outrageous Orange | black, 7.5 to 1 |
| 38 | `#ff7645` | `oklch(72.08% 0.1792 39.65)` | Precious Persimmon | black, 7.9 to 1 |
| 39 | `#ff7e46` | `oklch(73.32% 0.1719 43.00)` | Mythical Orange | black, 8.3 to 1 |
| 40 | `#ff8647` | `oklch(74.53% 0.1654 46.28)` | Tangerine Dream | black, 8.7 to 1 |
| 41 | `#ff8e49` | `oklch(75.70% 0.1597 49.47)` | Orangish | black, 9.2 to 1 |
| 42 | `#ff944c` | `oklch(76.82% 0.1546 52.52)` | Pastel Orange | black, 9.6 to 1 |
| 43 | `#ff9b4e` | `oklch(77.87% 0.1503 55.42)` | Autumn Splendour | black, 10 to 1 |
| 44 | `#ffa051` | `oklch(78.86% 0.1465 58.12)` | Bittersweet | black, 10.4 to 1 |
| 45 | `#ffa554` | `oklch(79.76% 0.1433 60.60)` | Echinoidea Thorns | black, 10.7 to 1 |
| 46 | `#ffaa56` | `oklch(80.58% 0.1406 62.82)` | Soul Side | black, 11.1 to 1 |
| 47 | `#ffae59` | `oklch(81.29% 0.1384 64.76)` | Vintage Orange | black, 11.4 to 1 |
| 48 | `#ffb15b` | `oklch(81.89% 0.1365 66.37)` | Vintage Orange | black, 11.6 to 1 |

## CSS

```css
background: radial-gradient(circle at 50% 50%, #1d124c 0.0%, #20134f 2.1%, #241352 4.3%, #281456 6.4%, #2d155b 8.5%, #33165f 10.6%, #391664 12.8%, #3f1769 14.9%, #47176d 17.0%, #4e1871 19.1%, #561875 21.3%, #5f1878 23.4%, #67187b 25.5%, #6f187d 27.7%, #78187f 29.8%, #801880 31.9%, #881980 34.0%, #8f1a80 36.2%, #971a80 38.3%, #9f1b7f 40.4%, #a71c7d 42.6%, #af1e7c 44.7%, #b71f79 46.8%, #bf2277 48.9%, #c72474 51.1%, #ce2870 53.2%, #d52b6d 55.3%, #dc2f69 57.4%, #e23464 59.6%, #e83960 61.7%, #ee3e5b 63.8%, #f34456 66.0%, #f74a51 68.1%, #fb514c 70.2%, #fe5846 72.3%, #ff6344 74.5%, #ff6d44 76.6%, #ff7645 78.7%, #ff7e46 80.9%, #ff8647 83.0%, #ff8e49 85.1%, #ff944c 87.2%, #ff9b4e 89.4%, #ffa051 91.5%, #ffa554 93.6%, #ffaa56 95.7%, #ffae59 97.9%, #ffb15b 100.0%);
background: radial-gradient(circle at 50% 50% in oklch, oklch(24.02% 0.1006 284.77) 0.0%, oklch(24.73% 0.1036 286.38) 2.1%, oklch(25.60% 0.1073 288.32) 4.3%, oklch(26.59% 0.1116 290.54) 6.4%, oklch(27.70% 0.1166 293.02) 8.5%, oklch(28.91% 0.1220 295.72) 10.6%, oklch(30.21% 0.1277 298.62) 12.8%, oklch(31.57% 0.1337 301.67) 14.9%, oklch(32.99% 0.1398 304.85) 17.0%, oklch(34.45% 0.1459 308.14) 19.1%, oklch(35.94% 0.1520 311.48) 21.3%, oklch(37.43% 0.1580 314.87) 23.4%, oklch(38.92% 0.1636 318.25) 25.5%, oklch(40.39% 0.1689 321.62) 27.7%, oklch(41.82% 0.1738 324.92) 29.8%, oklch(43.21% 0.1780 328.13) 31.9%, oklch(44.53% 0.1817 331.23) 34.0%, oklch(45.86% 0.1851 334.35) 36.2%, oklch(47.20% 0.1883 337.53) 38.3%, oklch(48.55% 0.1914 340.74) 40.4%, oklch(49.92% 0.1944 344.00) 42.6%, oklch(51.29% 0.1971 347.28) 44.7%, oklch(52.66% 0.1997 350.59) 46.8%, oklch(54.04% 0.2020 353.91) 48.9%, oklch(55.41% 0.2041 357.23) 51.1%, oklch(56.77% 0.2059 0.55) 53.2%, oklch(58.12% 0.2074 3.85) 55.3%, oklch(59.45% 0.2085 7.14) 57.4%, oklch(60.77% 0.2094 10.39) 59.6%, oklch(62.06% 0.2099 13.61) 61.7%, oklch(63.32% 0.2100 16.78) 63.8%, oklch(64.56% 0.2096 19.90) 66.0%, oklch(65.77% 0.2088 23.01) 68.1%, oklch(67.01% 0.2073 26.22) 70.2%, oklch(68.28% 0.2050 29.52) 72.3%, oklch(69.55% 0.1964 32.88) 74.5%, oklch(70.82% 0.1874 36.27) 76.6%, oklch(72.08% 0.1792 39.65) 78.7%, oklch(73.32% 0.1719 43.00) 80.9%, oklch(74.53% 0.1654 46.28) 83.0%, oklch(75.70% 0.1597 49.47) 85.1%, oklch(76.82% 0.1546 52.52) 87.2%, oklch(77.87% 0.1503 55.42) 89.4%, oklch(78.86% 0.1465 58.12) 91.5%, oklch(79.76% 0.1433 60.60) 93.6%, oklch(80.58% 0.1406 62.82) 95.7%, oklch(81.29% 0.1384 64.76) 97.9%, oklch(81.89% 0.1365 66.37) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.24 | 0.101 | 284.8 |
| 2 | 0.441 | 0.181 | 330.2 |
| 3 | 0.65 | 0.209 | 380.9 |
| 4 | 0.819 | 0.16 | 426.4 |

## In these collections

- [Tropical gradients](https://grabient.com/tropical-gradients)

## Other forms

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