# Pink mauve cobalt fade

Analogous lavender, pink and blue linear gradient with 32 colors: #a4819e, #a681a0, #aa82a3, #af84a7, #b585aa, #bb87af, #c189b3, #c88ab7, #cf8cbb, #d58dbf, #db8ec3, #df8ec6, #e38ec9, #e58dcb, #e68bcd, #e489cf, #e086d0, #d982d0, #d07dd0, #c578ce, #b872cc, #a96cc9, #9a65c5, #8a5fc0, #7958ba, #6952b4, #5a4cac, #4b47a5, #3e429e, #313d97, #263a91, #1d378d. Edit it and copy or download CSS, SVG, PNG or shader code.

- Also called: Analogous lavender, pink and blue linear gradient
- Seed: `kSpCvsXrPAS-1N8`
- Page: https://grabient.com/kSpCvsXrPAS-1N8?steps=32&angle=135
- Drawn as: linear gradient, 32 steps, 135 degrees
- Kinds: light center
- Hues: analogous
- Contrast of its darkest and lightest colors: 4.5 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 | `#a4819e` | `oklch(64.57% 0.0593 331.88)` | Pink Plumeria | black, 6.2 to 1 |
| 2 | `#a681a0` | `oklch(65.02% 0.0624 332.13)` | Pink Plumeria | black, 6.3 to 1 |
| 3 | `#aa82a3` | `oklch(65.69% 0.0664 332.65)` | Wilhelminian Pink | black, 6.4 to 1 |
| 4 | `#af84a7` | `oklch(66.56% 0.0712 333.37)` | Purple Stripe | black, 6.6 to 1 |
| 5 | `#b585aa` | `oklch(67.57% 0.0767 334.24)` | Opera Mauve | black, 6.9 to 1 |
| 6 | `#bb87af` | `oklch(68.66% 0.0826 335.20)` | Joie de Vivre | black, 7.1 to 1 |
| 7 | `#c189b3` | `oklch(69.81% 0.0889 336.17)` | Joie de Vivre | black, 7.4 to 1 |
| 8 | `#c88ab7` | `oklch(70.96% 0.0954 337.11)` | Rock Star Pink | black, 7.7 to 1 |
| 9 | `#cf8cbb` | `oklch(72.07% 0.1020 337.95)` | Cyclamen | black, 8 to 1 |
| 10 | `#d58dbf` | `oklch(73.09% 0.1086 338.63)` | Pressed Flower | black, 8.3 to 1 |
| 11 | `#db8ec3` | `oklch(73.98% 0.1150 339.10)` | Firm Pink | black, 8.6 to 1 |
| 12 | `#df8ec6` | `oklch(74.68% 0.1212 339.28)` | Firm Pink | black, 8.8 to 1 |
| 13 | `#e38ec9` | `oklch(75.16% 0.1269 339.13)` | Blushed Bombshell | black, 8.9 to 1 |
| 14 | `#e58dcb` | `oklch(75.37% 0.1321 338.58)` | Blushed Bombshell | black, 9 to 1 |
| 15 | `#e68bcd` | `oklch(75.26% 0.1367 337.56)` | Blushed Bombshell | black, 8.9 to 1 |
| 16 | `#e489cf` | `oklch(74.79% 0.1404 336.03)` | Blushed Bombshell | black, 8.7 to 1 |
| 17 | `#e086d0` | `oklch(73.90% 0.1433 333.88)` | Blushed Bombshell | black, 8.4 to 1 |
| 18 | `#d982d0` | `oklch(72.52% 0.1454 330.94)` | Blush Essence | black, 8 to 1 |
| 19 | `#d07dd0` | `oklch(70.69% 0.1471 327.29)` | Purple Kush | black, 7.5 to 1 |
| 20 | `#c578ce` | `oklch(68.49% 0.1483 323.04)` | Purple Kush | black, 6.9 to 1 |
| 21 | `#b872cc` | `oklch(65.98% 0.1490 318.30)` | Lavendless | black, 6.3 to 1 |
| 22 | `#a96cc9` | `oklch(63.23% 0.1494 313.19)` | Rich Lavender | black, 5.6 to 1 |
| 23 | `#9a65c5` | `oklch(60.31% 0.1494 307.81)` | Amethyst | black, 5 to 1 |
| 24 | `#8a5fc0` | `oklch(57.29% 0.1492 302.29)` | Lusty Lavender | white, 4.7 to 1 |
| 25 | `#7958ba` | `oklch(54.22% 0.1489 296.73)` | Fuchsia Blue | white, 5.3 to 1 |
| 26 | `#6952b4` | `oklch(51.19% 0.1484 291.25)` | Blue Marguerite | white, 6 to 1 |
| 27 | `#5a4cac` | `oklch(48.25% 0.1478 285.96)` | Swiss Plum | white, 6.8 to 1 |
| 28 | `#4b47a5` | `oklch(45.48% 0.1472 280.98)` | Megadrive Screen | white, 7.6 to 1 |
| 29 | `#3e429e` | `oklch(42.94% 0.1467 276.41)` | Galaxy Express | white, 8.5 to 1 |
| 30 | `#313d97` | `oklch(40.71% 0.1463 272.38)` | Liquid Denim | white, 9.3 to 1 |
| 31 | `#263a91` | `oklch(38.84% 0.1461 268.99)` | Navy Seal | white, 10 to 1 |
| 32 | `#1d378d` | `oklch(37.40% 0.1461 266.36)` | Dark Seashore Night | white, 10.6 to 1 |

## CSS

```css
background: linear-gradient(135deg, #a4819e 0.0%, #a681a0 3.2%, #aa82a3 6.5%, #af84a7 9.7%, #b585aa 12.9%, #bb87af 16.1%, #c189b3 19.4%, #c88ab7 22.6%, #cf8cbb 25.8%, #d58dbf 29.0%, #db8ec3 32.3%, #df8ec6 35.5%, #e38ec9 38.7%, #e58dcb 41.9%, #e68bcd 45.2%, #e489cf 48.4%, #e086d0 51.6%, #d982d0 54.8%, #d07dd0 58.1%, #c578ce 61.3%, #b872cc 64.5%, #a96cc9 67.7%, #9a65c5 71.0%, #8a5fc0 74.2%, #7958ba 77.4%, #6952b4 80.6%, #5a4cac 83.9%, #4b47a5 87.1%, #3e429e 90.3%, #313d97 93.5%, #263a91 96.8%, #1d378d 100.0%);
background: linear-gradient(135deg in oklch, oklch(64.57% 0.0593 331.88) 0.0%, oklch(65.02% 0.0624 332.13) 3.2%, oklch(65.69% 0.0664 332.65) 6.5%, oklch(66.56% 0.0712 333.37) 9.7%, oklch(67.57% 0.0767 334.24) 12.9%, oklch(68.66% 0.0826 335.20) 16.1%, oklch(69.81% 0.0889 336.17) 19.4%, oklch(70.96% 0.0954 337.11) 22.6%, oklch(72.07% 0.1020 337.95) 25.8%, oklch(73.09% 0.1086 338.63) 29.0%, oklch(73.98% 0.1150 339.10) 32.3%, oklch(74.68% 0.1212 339.28) 35.5%, oklch(75.16% 0.1269 339.13) 38.7%, oklch(75.37% 0.1321 338.58) 41.9%, oklch(75.26% 0.1367 337.56) 45.2%, oklch(74.79% 0.1404 336.03) 48.4%, oklch(73.90% 0.1433 333.88) 51.6%, oklch(72.52% 0.1454 330.94) 54.8%, oklch(70.69% 0.1471 327.29) 58.1%, oklch(68.49% 0.1483 323.04) 61.3%, oklch(65.98% 0.1490 318.30) 64.5%, oklch(63.23% 0.1494 313.19) 67.7%, oklch(60.31% 0.1494 307.81) 71.0%, oklch(57.29% 0.1492 302.29) 74.2%, oklch(54.22% 0.1489 296.73) 77.4%, oklch(51.19% 0.1484 291.25) 80.6%, oklch(48.25% 0.1478 285.96) 83.9%, oklch(45.48% 0.1472 280.98) 87.1%, oklch(42.94% 0.1467 276.41) 90.3%, oklch(40.71% 0.1463 272.38) 93.5%, oklch(38.84% 0.1461 268.99) 96.8%, oklch(37.40% 0.1461 266.36) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.646 | 0.059 | 331.9 |
| 2 | 0.744 | 0.142 | 335 |
| 3 | 0.374 | 0.146 | 266.4 |

## In these collections

- [Blue and mauve gradients](https://grabient.com/blue-and-mauve-gradients)

## Other forms

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