# Vivid tritone blue, purple and pink linear gradient

Vivid tritone blue, purple and pink linear gradient with 7 colors: #3679c6, #4357d8, #6a31d9, #911fc7, #b81ea4, #d73077, #e74d4f. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kWkWO0v9FDMFWQ3IT0Q0MVEQ`
- Page: https://grabient.com/kWkWO0v9FDMFWQ3IT0Q0MVEQ
- Drawn as: linear gradient, 7 steps, 90 degrees
- Kinds: vivid
- Hues: wide
- Contrast of its darkest and lightest colors: 1.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 | `#3679c6` | `oklch(57.09% 0.1364 253.83)` | Celestial Plum | black, 4.7 to 1 |
| 2 | `#4357d8` | `oklch(52.01% 0.1965 270.97)` | Warm Blue | white, 5.8 to 1 |
| 3 | `#6a31d9` | `oklch(49.62% 0.2345 290.78)` | Burple | white, 6.8 to 1 |
| 4 | `#911fc7` | `oklch(51.18% 0.2370 310.89)` | Lilac Spring | white, 6.5 to 1 |
| 5 | `#b81ea4` | `oklch(54.61% 0.2260 334.53)` | Amora Purple | white, 5.6 to 1 |
| 6 | `#d73077` | `oklch(59.08% 0.2081 0.44)` | Beetroot Purple | white, 4.5 to 1 |
| 7 | `#e74d4f` | `oklch(63.39% 0.1902 23.81)` | Fever | black, 5.5 to 1 |

## CSS

```css
background: linear-gradient(90deg, #3679c6 0.0%, #4357d8 16.7%, #6a31d9 33.3%, #911fc7 50.0%, #b81ea4 66.7%, #d73077 83.3%, #e74d4f 100.0%);
background: linear-gradient(90deg in oklch, oklch(57.09% 0.1364 253.83) 0.0%, oklch(52.01% 0.1965 270.97) 16.7%, oklch(49.62% 0.2345 290.78) 33.3%, oklch(51.18% 0.2370 310.89) 50.0%, oklch(54.61% 0.2260 334.53) 66.7%, oklch(59.08% 0.2081 0.44) 83.3%, oklch(63.39% 0.1902 23.81) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.571 | 0.136 | 253.8 |
| 2 | 0.5 | 0.223 | 281.3 |
| 3 | 0.512 | 0.237 | 310.9 |
| 4 | 0.567 | 0.218 | 346.8 |
| 5 | 0.634 | 0.19 | 383.8 |

## In these collections

- [Sequined feather costume](https://grabient.com/sequined-feather-costume)

## Other forms

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