# Rainbow from black to orange linear gradient

Rainbow from black to orange linear gradient with 7 colors: #121212, #aca49a, #b9d6ac, #3d64b4, #c4347b, #e47f00, #e7c62d. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kWLgBAc4y_0GxVJPyc8abpHg`
- Page: https://grabient.com/kWLgBAc4y_0GxVJPyc8abpHg
- Drawn as: linear gradient, 7 steps, 90 degrees
- Kinds: rainbow
- Hues: wide
- Contrast of its darkest and lightest colors: 11.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 | `#121212` | `oklch(18.11% 0.0000 89.88)` | Dark Tone Ink | white, 18.7 to 1 |
| 2 | `#aca49a` | `oklch(72.28% 0.0168 76.34)` | Warm Grey Flannel | black, 8.5 to 1 |
| 3 | `#b9d6ac` | `oklch(84.27% 0.0643 135.79)` | Bleached Spruce | black, 13.2 to 1 |
| 4 | `#3d64b4` | `oklch(51.57% 0.1350 263.31)` | Kakitsubata Blue | white, 5.7 to 1 |
| 5 | `#c4347b` | `oklch(56.36% 0.1894 354.97)` | Pink Shadow | white, 5 to 1 |
| 6 | `#e47f00` | `oklch(69.48% 0.1634 59.73)` | Sports Fan | black, 7.3 to 1 |
| 7 | `#e7c62d` | `oklch(83.07% 0.1598 95.64)` | Thai Temple | black, 12.4 to 1 |

## CSS

```css
background: linear-gradient(90deg, #121212 0.0%, #aca49a 16.7%, #b9d6ac 33.3%, #3d64b4 50.0%, #c4347b 66.7%, #e47f00 83.3%, #e7c62d 100.0%);
background: linear-gradient(90deg in oklch, oklch(18.11% 0.0000 89.88) 0.0%, oklch(72.28% 0.0168 76.34) 16.7%, oklch(84.27% 0.0643 135.79) 33.3%, oklch(51.57% 0.1350 263.31) 50.0%, oklch(56.36% 0.1894 354.97) 66.7%, oklch(69.48% 0.1634 59.73) 83.3%, oklch(83.07% 0.1598 95.64) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.181 | 0 | 90 |
| 2 | 0.909 | 0.034 | 88.9 |
| 3 | 0.516 | 0.135 | 263.3 |
| 4 | 0.626 | 0.203 | 391.2 |
| 5 | 0.831 | 0.16 | 455.6 |

## In these collections

- [Zine colors](https://grabient.com/zine-colors)

## Other forms

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