# Light blue, dark purple and maroon linear gradient

Light blue, dark purple and maroon linear gradient with 8 colors: #e4fffe, #b7f5db, #82b5ae, #53747c, #3a3a50, #3d1730, #5d0e21, #8d2324. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kc-RiJdRo892UQfEDsOLY3ICKZxuoKEONrPBQ`
- Page: https://grabient.com/kc-RiJdRo892UQfEDsOLY3ICKZxuoKEONrPBQ?steps=8&angle=0
- Drawn as: linear gradient, 8 steps, 0 degrees
- Kinds: dark center
- Hues: complementary
- Contrast of its darkest and lightest colors: 14.7 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 | `#e4fffe` | `oklch(98.03% 0.0278 192.69)` | Bubbles | black, 20 to 1 |
| 2 | `#b7f5db` | `oklch(92.13% 0.0717 167.29)` | Seafair Green | black, 17.1 to 1 |
| 3 | `#82b5ae` | `oklch(73.62% 0.0551 184.20)` | Melodious | black, 9.2 to 1 |
| 4 | `#53747c` | `oklch(53.54% 0.0400 214.85)` | Blue Sage | white, 5 to 1 |
| 5 | `#3a3a50` | `oklch(35.83% 0.0372 283.54)` | Carbon Blue | white, 11 to 1 |
| 6 | `#3d1730` | `oklch(27.17% 0.0703 342.71)` | Nightly Voyager | white, 15.4 to 1 |
| 7 | `#5d0e21` | `oklch(31.50% 0.1102 13.36)` | Chocolate Cosmos | white, 13.5 to 1 |
| 8 | `#8d2324` | `oklch(42.91% 0.1419 24.99)` | Old Mandarin | white, 8.7 to 1 |

## CSS

```css
background: linear-gradient(0deg, #e4fffe 0.0%, #b7f5db 14.3%, #82b5ae 28.6%, #53747c 42.9%, #3a3a50 57.1%, #3d1730 71.4%, #5d0e21 85.7%, #8d2324 100.0%);
background: linear-gradient(0deg in oklch, oklch(98.03% 0.0278 192.69) 0.0%, oklch(92.13% 0.0717 167.29) 14.3%, oklch(73.62% 0.0551 184.20) 28.6%, oklch(53.54% 0.0400 214.85) 42.9%, oklch(35.83% 0.0372 283.54) 57.1%, oklch(27.17% 0.0703 342.71) 71.4%, oklch(31.50% 0.1102 13.36) 85.7%, oklch(42.91% 0.1419 24.99) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.98 | 0.033 | 192.7 |
| 2 | 0.921 | 0.072 | 167.3 |
| 3 | 0.736 | 0.055 | 184.2 |
| 4 | 0.535 | 0.04 | 214.8 |
| 5 | 0.358 | 0.037 | 283.5 |
| 6 | 0.272 | 0.07 | 342.7 |
| 7 | 0.315 | 0.11 | 373.4 |
| 8 | 0.429 | 0.142 | 385 |

## In these collections

- [Alpine thaw](https://grabient.com/alpine-thaw)

## Other forms

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