# Navy pink diagonal bloom

Muted lavender, pink and navy linear gradient with 32 colors: #b8a1d0, #bfa1d4, #caa2d9, #d9a3dd, #e9a3df, #f7a2de, #ff9fda, #ff9cd6, #f794d3, #e089ce, #be7cc6, #966eb6, #6f5fa0, #4c5186, #32446d, #223a5a, #1b3550, #1b344c, #1e354c, #253950, #2d3f56, #36465e, #404d67, #4a546f, #535a76, #606180, #6e698a, #7e7295, #8f7a9e, #9e82a5, #ac89aa, #b58eae. Edit it and copy or download CSS, SVG, PNG or shader code.

- Also called: Muted lavender, pink and navy linear gradient
- Seed: `kWvTTa5TPEKoWNU5kUH2BfHQ`
- Page: https://grabient.com/kWvTTa5TPEKoWNU5kUH2BfHQ?steps=32&angle=225
- Drawn as: linear gradient, 32 steps, 225 degrees
- Kinds: dark center, muted
- Hues: wide
- Contrast of its darkest and lightest colors: 6.8 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 | `#b8a1d0` | `oklch(74.41% 0.0717 307.27)` | Purple Premiere | black, 9 to 1 |
| 2 | `#bfa1d4` | `oklch(75.19% 0.0784 311.06)` | Enchanted Lavender | black, 9.2 to 1 |
| 3 | `#caa2d9` | `oklch(76.64% 0.0885 317.09)` | Autumn Wisteria | black, 9.6 to 1 |
| 4 | `#d9a3dd` | `oklch(78.39% 0.1007 324.34)` | Plum Juice | black, 10.2 to 1 |
| 5 | `#e9a3df` | `oklch(80.07% 0.1134 331.74)` | Candy Floss | black, 10.7 to 1 |
| 6 | `#f7a2de` | `oklch(81.31% 0.1253 338.27)` | Lavender Rose | black, 11.1 to 1 |
| 7 | `#ff9fda` | `oklch(81.76% 0.1337 342.88)` | Rose Daphne | black, 11.2 to 1 |
| 8 | `#ff9cd6` | `oklch(81.05% 0.1368 344.53)` | Rose Daphne | black, 10.9 to 1 |
| 9 | `#f794d3` | `oklch(78.78% 0.1416 342.14)` | Bubblegum Kisses | black, 10.1 to 1 |
| 10 | `#e089ce` | `oklch(74.32% 0.1367 334.68)` | Blushed Bombshell | black, 8.6 to 1 |
| 11 | `#be7cc6` | `oklch(68.06% 0.1274 323.12)` | Lavender Sweater | black, 6.8 to 1 |
| 12 | `#966eb6` | `oklch(60.70% 0.1151 308.97)` | Viola | black, 5.2 to 1 |
| 13 | `#6f5fa0` | `oklch(52.95% 0.1012 293.72)` | Scampi | white, 5.4 to 1 |
| 14 | `#4c5186` | `oklch(45.53% 0.0872 278.88)` | Twilight | white, 7.4 to 1 |
| 15 | `#32446d` | `oklch(39.15% 0.0744 265.94)` | Space Missions | white, 9.6 to 1 |
| 16 | `#223a5a` | `oklch(34.51% 0.0643 256.40)` | Navy Peony | white, 11.5 to 1 |
| 17 | `#1b3550` | `oklch(32.18% 0.0578 251.36)` | Incremental Blue | white, 12.5 to 1 |
| 18 | `#1b344c` | `oklch(31.56% 0.0532 249.24)` | Sea of Stars | white, 12.8 to 1 |
| 19 | `#1e354c` | `oklch(32.25% 0.0501 249.32)` | Crow Black | white, 12.5 to 1 |
| 20 | `#253950` | `oklch(33.94% 0.0480 251.22)` | Cool Air of Debonair | white, 11.7 to 1 |
| 21 | `#2d3f56` | `oklch(36.33% 0.0469 254.53)` | Academic Blue | white, 10.7 to 1 |
| 22 | `#36465e` | `oklch(39.11% 0.0465 258.86)` | Spelunking | white, 9.5 to 1 |
| 23 | `#404d67` | `oklch(42.00% 0.0465 263.81)` | Evening Over the Ocean | white, 8.4 to 1 |
| 24 | `#4a546f` | `oklch(44.67% 0.0468 268.99)` | Snoop | white, 7.5 to 1 |
| 25 | `#535a76` | `oklch(47.24% 0.0474 274.78)` | Nightshade Purple | white, 6.8 to 1 |
| 26 | `#606180` | `oklch(50.37% 0.0491 282.51)` | Strong Iris | white, 5.9 to 1 |
| 27 | `#6e698a` | `oklch(53.90% 0.0516 291.58)` | Aromatic | white, 5.1 to 1 |
| 28 | `#7e7295` | `oklch(57.59% 0.0546 301.29)` | Purple Haze | black, 4.7 to 1 |
| 29 | `#8f7a9e` | `oklch(61.20% 0.0577 310.94)` | Pickled Purple | black, 5.4 to 1 |
| 30 | `#9e82a5` | `oklch(64.51% 0.0606 319.84)` | Rhapsody | black, 6.2 to 1 |
| 31 | `#ac89aa` | `oklch(67.28% 0.0631 327.30)` | Dusty Lavender | black, 6.8 to 1 |
| 32 | `#b58eae` | `oklch(69.29% 0.0648 332.63)` | Tiny Ribbons | black, 7.4 to 1 |

## CSS

```css
background: linear-gradient(225deg, #b8a1d0 0.0%, #bfa1d4 3.2%, #caa2d9 6.5%, #d9a3dd 9.7%, #e9a3df 12.9%, #f7a2de 16.1%, #ff9fda 19.4%, #ff9cd6 22.6%, #f794d3 25.8%, #e089ce 29.0%, #be7cc6 32.3%, #966eb6 35.5%, #6f5fa0 38.7%, #4c5186 41.9%, #32446d 45.2%, #223a5a 48.4%, #1b3550 51.6%, #1b344c 54.8%, #1e354c 58.1%, #253950 61.3%, #2d3f56 64.5%, #36465e 67.7%, #404d67 71.0%, #4a546f 74.2%, #535a76 77.4%, #606180 80.6%, #6e698a 83.9%, #7e7295 87.1%, #8f7a9e 90.3%, #9e82a5 93.5%, #ac89aa 96.8%, #b58eae 100.0%);
background: linear-gradient(225deg in oklch, oklch(74.41% 0.0717 307.27) 0.0%, oklch(75.19% 0.0784 311.06) 3.2%, oklch(76.64% 0.0885 317.09) 6.5%, oklch(78.39% 0.1007 324.34) 9.7%, oklch(80.07% 0.1134 331.74) 12.9%, oklch(81.31% 0.1253 338.27) 16.1%, oklch(81.76% 0.1337 342.88) 19.4%, oklch(81.05% 0.1368 344.53) 22.6%, oklch(78.78% 0.1416 342.14) 25.8%, oklch(74.32% 0.1367 334.68) 29.0%, oklch(68.06% 0.1274 323.12) 32.3%, oklch(60.70% 0.1151 308.97) 35.5%, oklch(52.95% 0.1012 293.72) 38.7%, oklch(45.53% 0.0872 278.88) 41.9%, oklch(39.15% 0.0744 265.94) 45.2%, oklch(34.51% 0.0643 256.40) 48.4%, oklch(32.18% 0.0578 251.36) 51.6%, oklch(31.56% 0.0532 249.24) 54.8%, oklch(32.25% 0.0501 249.32) 58.1%, oklch(33.94% 0.0480 251.22) 61.3%, oklch(36.33% 0.0469 254.53) 64.5%, oklch(39.11% 0.0465 258.86) 67.7%, oklch(42.00% 0.0465 263.81) 71.0%, oklch(44.67% 0.0468 268.99) 74.2%, oklch(47.24% 0.0474 274.78) 77.4%, oklch(50.37% 0.0491 282.51) 80.6%, oklch(53.90% 0.0516 291.58) 83.9%, oklch(57.59% 0.0546 301.29) 87.1%, oklch(61.20% 0.0577 310.94) 90.3%, oklch(64.51% 0.0606 319.84) 93.5%, oklch(67.28% 0.0631 327.30) 96.8%, oklch(69.29% 0.0648 332.63) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.744 | 0.072 | 307.3 |
| 2 | 0.795 | 0.142 | 343.2 |
| 3 | 0.331 | 0.061 | 253.4 |
| 4 | 0.453 | 0.047 | 270.3 |
| 5 | 0.693 | 0.065 | 332.6 |

## In these collections

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

## Other forms

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