# Orange, purple, blue and gray linear gradient

Orange, purple, blue and gray linear gradient with 8 colors: #db6735, #b34743, #793b61, #4e4687, #4c66ad, #708fc9, #aab3d7, #d6c5d6. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kcpHMeRTO97ikOw3Jjkwqo9lKiP3iE0FawtGA`
- Page: https://grabient.com/kcpHMeRTO97ikOw3Jjkwqo9lKiP3iE0FawtGA?steps=8
- Drawn as: linear gradient, 8 steps, 90 degrees
- Kinds: dark center
- Hues: wide
- Contrast of its darkest and lightest colors: 5 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 | `#db6735` | `oklch(64.57% 0.1585 42.19)` | Bronzed | black, 5.9 to 1 |
| 2 | `#b34743` | `oklch(54.33% 0.1419 25.28)` | Empower | white, 5.3 to 1 |
| 3 | `#793b61` | `oklch(44.49% 0.0992 344.07)` | Burnt Orchid | white, 8 to 1 |
| 4 | `#4e4687` | `oklch(43.31% 0.1047 287.00)` | Moonlight Sonata | white, 8.2 to 1 |
| 5 | `#4c66ad` | `oklch(52.36% 0.1157 266.92)` | Submarine Base | white, 5.5 to 1 |
| 6 | `#708fc9` | `oklch(64.96% 0.0937 262.70)` | Organza Violet | black, 6.4 to 1 |
| 7 | `#aab3d7` | `oklch(77.17% 0.0524 274.32)` | Pixie Violet | black, 10.1 to 1 |
| 8 | `#d6c5d6` | `oklch(84.25% 0.0303 326.10)` | Tender Touch | black, 12.8 to 1 |

## CSS

```css
background: linear-gradient(90deg, #db6735 0.0%, #b34743 14.3%, #793b61 28.6%, #4e4687 42.9%, #4c66ad 57.1%, #708fc9 71.4%, #aab3d7 85.7%, #d6c5d6 100.0%);
background: linear-gradient(90deg in oklch, oklch(64.57% 0.1585 42.19) 0.0%, oklch(54.33% 0.1419 25.28) 14.3%, oklch(44.49% 0.0992 344.07) 28.6%, oklch(43.31% 0.1047 287.00) 42.9%, oklch(52.36% 0.1157 266.92) 57.1%, oklch(64.96% 0.0937 262.70) 71.4%, oklch(77.17% 0.0524 274.32) 85.7%, oklch(84.25% 0.0303 326.10) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.646 | 0.158 | 42.2 |
| 2 | 0.543 | 0.142 | 25.3 |
| 3 | 0.445 | 0.099 | -15.9 |
| 4 | 0.433 | 0.105 | -73 |
| 5 | 0.524 | 0.116 | -93.1 |
| 6 | 0.65 | 0.094 | -97.3 |
| 7 | 0.772 | 0.052 | -85.7 |
| 8 | 0.843 | 0.03 | -33.9 |

## In these collections

- [Paper lantern dusk](https://grabient.com/paper-lantern-dusk)

## Other forms

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