# Orange, rose and navy sunset palette

Orange, pink, purple and navy linear gradient with 32 colors: #ff8f51, #ff894f, #ff814b, #fe784a, #fc6e4a, #f9634c, #f6594f, #f14f53, #ec4758, #e6415c, #df3b61, #d73765, #cf3368, #c7316b, #be2e6e, #b52c71, #ac2a73, #a22875, #972676, #8d2577, #822477, #782376, #6d2274, #632172, #5a206e, #502069, #451f63, #3c1e5d, #331c56, #2c1b4f, #271a49, #221945. Edit it and copy or download CSS, SVG, PNG or shader code.

- Also called: Orange, pink, purple and navy linear gradient
- Seed: `kWwXQiUci8sJBvKwszvoB08Y`
- Page: https://grabient.com/kWwXQiUci8sJBvKwszvoB08Y?steps=32&angle=135
- Drawn as: linear gradient, 32 steps, 135 degrees
- Kinds: light to dark, vivid
- Hues: wide
- Contrast of its darkest and lightest colors: 7.1 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 | `#ff8f51` | `oklch(75.98% 0.1554 47.81)` | Boredom Buster | black, 9.2 to 1 |
| 2 | `#ff894f` | `oklch(75.04% 0.1606 45.61)` | Valley of Fire | black, 8.9 to 1 |
| 3 | `#ff814b` | `oklch(73.78% 0.1678 42.68)` | Mythical Orange | black, 8.5 to 1 |
| 4 | `#fe784a` | `oklch(72.29% 0.1751 39.17)` | Precious Persimmon | black, 7.9 to 1 |
| 5 | `#fc6e4a` | `oklch(70.63% 0.1819 35.29)` | Outrageous Orange | black, 7.4 to 1 |
| 6 | `#f9634c` | `oklch(68.87% 0.1884 31.20)` | Sango Red | black, 6.9 to 1 |
| 7 | `#f6594f` | `oklch(67.10% 0.1940 27.08)` | Hot Coral | black, 6.4 to 1 |
| 8 | `#f14f53` | `oklch(65.38% 0.1981 23.11)` | Pastel Strawberry | black, 5.9 to 1 |
| 9 | `#ec4758` | `oklch(63.79% 0.2001 19.45)` | Vineyard Autumn | black, 5.6 to 1 |
| 10 | `#e6415c` | `oklch(62.24% 0.2003 15.97)` | Paradise Pink | black, 5.2 to 1 |
| 11 | `#df3b61` | `oklch(60.71% 0.1992 12.55)` | Intense Passion | black, 4.9 to 1 |
| 12 | `#d73765` | `oklch(59.16% 0.1970 9.14)` | 1989 Miami Hotline | black, 4.6 to 1 |
| 13 | `#cf3368` | `oklch(57.61% 0.1939 5.70)` | Spicy Berry | white, 4.8 to 1 |
| 14 | `#c7316b` | `oklch(56.04% 0.1904 2.19)` | Spicy Berry | white, 5.1 to 1 |
| 15 | `#be2e6e` | `oklch(54.44% 0.1864 358.58)` | Pink Shadow | white, 5.5 to 1 |
| 16 | `#b52c71` | `oklch(52.80% 0.1825 354.81)` | Hibiscus | white, 5.9 to 1 |
| 17 | `#ac2a73` | `oklch(51.12% 0.1786 350.85)` | Carroburg Crimson | white, 6.3 to 1 |
| 18 | `#a22875` | `oklch(49.39% 0.1744 346.65)` | Carroburg Crimson | white, 6.8 to 1 |
| 19 | `#972676` | `oklch(47.61% 0.1699 342.27)` | Haunted Purple | white, 7.3 to 1 |
| 20 | `#8d2577` | `oklch(45.81% 0.1650 337.78)` | Noble Plum | white, 7.8 to 1 |
| 21 | `#822477` | `oklch(43.99% 0.1598 333.25)` | Noble Plum | white, 8.5 to 1 |
| 22 | `#782376` | `oklch(42.18% 0.1543 328.74)` | Count’s Wardrobe | white, 9.1 to 1 |
| 23 | `#6d2274` | `oklch(40.38% 0.1484 324.33)` | Berry Blackmail | white, 9.8 to 1 |
| 24 | `#632172` | `oklch(38.62% 0.1422 320.08)` | Berry Blackmail | white, 10.5 to 1 |
| 25 | `#5a206e` | `oklch(36.85% 0.1352 315.89)` | Violethargic | white, 11.2 to 1 |
| 26 | `#502069` | `oklch(34.95% 0.1271 311.49)` | Elegant Purple Gown | white, 12 to 1 |
| 27 | `#451f63` | `oklch(32.99% 0.1181 307.03)` | Fading Horizon | white, 12.8 to 1 |
| 28 | `#3c1e5d` | `oklch(31.07% 0.1089 302.67)` | Christalle | white, 13.7 to 1 |
| 29 | `#331c56` | `oklch(29.25% 0.0999 298.56)` | Fabric of Space | white, 14.5 to 1 |
| 30 | `#2c1b4f` | `oklch(27.61% 0.0918 294.89)` | Russian Violet | white, 15.2 to 1 |
| 31 | `#271a49` | `oklch(26.23% 0.0849 291.80)` | Silent Orbit | white, 15.8 to 1 |
| 32 | `#221945` | `oklch(25.20% 0.0799 289.46)` | Prune Plum | white, 16.2 to 1 |

## CSS

```css
background: linear-gradient(135deg, #ff8f51 0.0%, #ff894f 3.2%, #ff814b 6.5%, #fe784a 9.7%, #fc6e4a 12.9%, #f9634c 16.1%, #f6594f 19.4%, #f14f53 22.6%, #ec4758 25.8%, #e6415c 29.0%, #df3b61 32.3%, #d73765 35.5%, #cf3368 38.7%, #c7316b 41.9%, #be2e6e 45.2%, #b52c71 48.4%, #ac2a73 51.6%, #a22875 54.8%, #972676 58.1%, #8d2577 61.3%, #822477 64.5%, #782376 67.7%, #6d2274 71.0%, #632172 74.2%, #5a206e 77.4%, #502069 80.6%, #451f63 83.9%, #3c1e5d 87.1%, #331c56 90.3%, #2c1b4f 93.5%, #271a49 96.8%, #221945 100.0%);
background: linear-gradient(135deg in oklch, oklch(75.98% 0.1554 47.81) 0.0%, oklch(75.04% 0.1606 45.61) 3.2%, oklch(73.78% 0.1678 42.68) 6.5%, oklch(72.29% 0.1751 39.17) 9.7%, oklch(70.63% 0.1819 35.29) 12.9%, oklch(68.87% 0.1884 31.20) 16.1%, oklch(67.10% 0.1940 27.08) 19.4%, oklch(65.38% 0.1981 23.11) 22.6%, oklch(63.79% 0.2001 19.45) 25.8%, oklch(62.24% 0.2003 15.97) 29.0%, oklch(60.71% 0.1992 12.55) 32.3%, oklch(59.16% 0.1970 9.14) 35.5%, oklch(57.61% 0.1939 5.70) 38.7%, oklch(56.04% 0.1904 2.19) 41.9%, oklch(54.44% 0.1864 358.58) 45.2%, oklch(52.80% 0.1825 354.81) 48.4%, oklch(51.12% 0.1786 350.85) 51.6%, oklch(49.39% 0.1744 346.65) 54.8%, oklch(47.61% 0.1699 342.27) 58.1%, oklch(45.81% 0.1650 337.78) 61.3%, oklch(43.99% 0.1598 333.25) 64.5%, oklch(42.18% 0.1543 328.74) 67.7%, oklch(40.38% 0.1484 324.33) 71.0%, oklch(38.62% 0.1422 320.08) 74.2%, oklch(36.85% 0.1352 315.89) 77.4%, oklch(34.95% 0.1271 311.49) 80.6%, oklch(32.99% 0.1181 307.03) 83.9%, oklch(31.07% 0.1089 302.67) 87.1%, oklch(29.25% 0.0999 298.56) 90.3%, oklch(27.61% 0.0918 294.89) 93.5%, oklch(26.23% 0.0849 291.80) 96.8%, oklch(25.20% 0.0799 289.46) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.76 | 0.16 | 47.8 |
| 2 | 0.642 | 0.2 | 20.3 |
| 3 | 0.52 | 0.181 | -7.1 |
| 4 | 0.382 | 0.141 | -41 |
| 5 | 0.252 | 0.08 | -70.5 |

## In these collections

- [Sunset gradients](https://grabient.com/sunset-gradients)

## Other forms

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