# Analogous dark purple to pink linear gradient

Analogous dark purple to pink linear gradient with 7 colors: #3e1a32, #582b57, #764881, #996c9f, #bf92b2, #e5b1bb, #ffcbb5. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kWRzHzNaU9kuhwBhFsL8BlGg`
- Page: https://grabient.com/kWRzHzNaU9kuhwBhFsL8BlGg
- Drawn as: linear gradient, 7 steps, 90 degrees
- Kinds: dark to light
- Hues: analogous
- Contrast of its darkest and lightest colors: 10.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 | `#3e1a32` | `oklch(27.95% 0.0675 341.72)` | Blackberry | white, 15 to 1 |
| 2 | `#582b57` | `oklch(36.64% 0.0925 327.51)` | Kuwanomi Purple | white, 11 to 1 |
| 3 | `#764881` | `oklch(47.68% 0.1028 319.53)` | Lilac Violet | white, 6.9 to 1 |
| 4 | `#996c9f` | `oklch(59.45% 0.0923 322.70)` | Dark Lilac | black, 4.9 to 1 |
| 5 | `#bf92b2` | `oklch(71.13% 0.0701 336.44)` | Mauve Magic | black, 7.9 to 1 |
| 6 | `#e5b1bb` | `oklch(81.13% 0.0618 6.53)` | Amazon River Dolphin | black, 11.3 to 1 |
| 7 | `#ffcbb5` | `oklch(88.19% 0.0667 44.07)` | Peach and Quiet | black, 14.4 to 1 |

## CSS

```css
background: linear-gradient(90deg, #3e1a32 0.0%, #582b57 16.7%, #764881 33.3%, #996c9f 50.0%, #bf92b2 66.7%, #e5b1bb 83.3%, #ffcbb5 100.0%);
background: linear-gradient(90deg in oklch, oklch(27.95% 0.0675 341.72) 0.0%, oklch(36.64% 0.0925 327.51) 16.7%, oklch(47.68% 0.1028 319.53) 33.3%, oklch(59.45% 0.0923 322.70) 50.0%, oklch(71.13% 0.0701 336.44) 66.7%, oklch(81.13% 0.0618 6.53) 83.3%, oklch(88.19% 0.0667 44.07) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.28 | 0.068 | 341.7 |
| 2 | 0.421 | 0.102 | 321.6 |
| 3 | 0.594 | 0.092 | 322.7 |
| 4 | 0.764 | 0.062 | 348.1 |
| 5 | 0.882 | 0.069 | 404.1 |

## In these collections

- [Soft multicolor gradients](https://grabient.com/soft-multicolor-gradients)
- [Muted gradients](https://grabient.com/muted-gradients)

## Other forms

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