# Rainbow from red to purple linear gradient

Rainbow from red to purple linear gradient with 7 colors: #ea2f36, #f78000, #f1ce3b, #51ba3c, #00c3c4, #006edb, #934ce4. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kam6ASW8VDe06RLZRUVXjpGcZTxxJ0EVA`
- Page: https://grabient.com/kam6ASW8VDe06RLZRUVXjpGcZTxxJ0EVA
- Drawn as: linear gradient, 7 steps, 90 degrees
- Kinds: vivid, rainbow
- Hues: two-hue
- 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 | `#ea2f36` | `oklch(61.02% 0.2205 25.31)` | Allura Red | black, 4.9 to 1 |
| 2 | `#f78000` | `oklch(72.05% 0.1786 54.89)` | University of Tennessee Orange | black, 8 to 1 |
| 3 | `#f1ce3b` | `oklch(85.83% 0.1598 95.06)` | Golden Kiwi | black, 13.6 to 1 |
| 4 | `#51ba3c` | `oklch(70.08% 0.1902 140.50)` | Exit Light | black, 8.4 to 1 |
| 5 | `#00c3c4` | `oklch(74.02% 0.1262 195.45)` | Cala Benirrás Blue | black, 9.6 to 1 |
| 6 | `#006edb` | `oklch(55.12% 0.1861 255.70)` | Flickr Blue | white, 4.9 to 1 |
| 7 | `#934ce4` | `oklch(57.87% 0.2205 301.12)` | Pericallis Hybrida | white, 4.7 to 1 |

## CSS

```css
background: linear-gradient(90deg, #ea2f36 0.0%, #f78000 16.7%, #f1ce3b 33.3%, #51ba3c 50.0%, #00c3c4 66.7%, #006edb 83.3%, #934ce4 100.0%);
background: linear-gradient(90deg in oklch, oklch(61.02% 0.2205 25.31) 0.0%, oklch(72.05% 0.1786 54.89) 16.7%, oklch(85.83% 0.1598 95.06) 33.3%, oklch(70.08% 0.1902 140.50) 50.0%, oklch(74.02% 0.1262 195.45) 66.7%, oklch(55.12% 0.1861 255.70) 83.3%, oklch(57.87% 0.2205 301.12) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.61 | 0.22 | 25.3 |
| 2 | 0.72 | 0.19 | 54.9 |
| 3 | 0.858 | 0.16 | 95.1 |
| 4 | 0.701 | 0.19 | 140.5 |
| 5 | 0.74 | 0.16 | 195.4 |
| 6 | 0.551 | 0.23 | 255.7 |
| 7 | 0.579 | 0.22 | 301.1 |

## In these collections

- [Rainbow gradients](https://grabient.com/rainbow-gradients)

## Other forms

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