# Blue and Mauve: Magenta and pale blush

The "Blue and Mauve: Magenta and pale blush" palette brings together magenta, light magenta, pale magenta, and pale blue. The colors span a moderate lightness range, combining strong color with gentle contrast. Its light and open character suits brand mood boards and editorial graphics. Its darkest tone is magenta, and its lightest tone is pale magenta.

- Also called: Analogous purple, pink and light blue linear gradient
- Seed: `kWoHXpYDpBm-fP_5DT2cJM5w`
- Page: https://grabient.com/kWoHXpYDpBm-fP_5DT2cJM5w?steps=6&angle=315
- Drawn as: linear gradient, 6 steps, 315 degrees
- Kinds: vivid, light
- Hues: monochromatic
- Contrast of its darkest and lightest colors: 3.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 | `#bb61ba` | `oklch(62.99% 0.1612 327.66)` | Mazzy Star | black, 5.5 to 1 |
| 2 | `#e97ac9` | `oklch(72.89% 0.1648 339.31)` | Fuchsia Blush | black, 8 to 1 |
| 3 | `#fea9dc` | `oklch(83.27% 0.1169 343.50)` | Fresh Gum | black, 11.9 to 1 |
| 4 | `#ffd5f3` | `oklch(91.81% 0.0603 336.32)` | Sweet Sachet | black, 16.1 to 1 |
| 5 | `#f6e7ff` | `oklch(94.74% 0.0348 312.17)` | Soft Lavender | black, 17.8 to 1 |
| 6 | `#cbd9fd` | `oklch(88.58% 0.0524 269.53)` | Icy Plains | black, 14.8 to 1 |

## CSS

```css
background: linear-gradient(315deg, #bb61ba 0.0%, #e97ac9 20.0%, #fea9dc 40.0%, #ffd5f3 60.0%, #f6e7ff 80.0%, #cbd9fd 100.0%);
background: linear-gradient(315deg in oklch, oklch(62.99% 0.1612 327.66) 0.0%, oklch(72.89% 0.1648 339.31) 20.0%, oklch(83.27% 0.1169 343.50) 40.0%, oklch(91.81% 0.0603 336.32) 60.0%, oklch(94.74% 0.0348 312.17) 80.0%, oklch(88.58% 0.0524 269.53) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.63 | 0.161 | 327.7 |
| 2 | 0.756 | 0.16 | 341.4 |
| 3 | 0.878 | 0.085 | 341.4 |
| 4 | 0.953 | 0.036 | 321.3 |
| 5 | 0.886 | 0.052 | 269.5 |

## In these collections

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

## Other forms

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