# Black to red sale gradient

Analogous black, red and orange linear gradient with 32 colors: #080404, #0c0505, #120606, #180706, #200908, #280a09, #310b0a, #3a0c0c, #430d0d, #4d0d0e, #570d0e, #620c0e, #6e0b0e, #79090e, #84070d, #8f050c, #99030c, #a3020c, #ad010c, #b6000d, #bf010f, #c70410, #cf0a12, #d61314, #dc1d16, #e12818, #e6321b, #ea3c1f, #ed4522, #ef4d26, #f25329, #f3572b. Edit it and copy or download CSS, SVG, PNG or shader code.

- Also called: Analogous black, red and orange linear gradient
- Seed: `kWHgcSIB0_7W9wDHUEAVEjAw`
- Page: https://grabient.com/kWHgcSIB0_7W9wDHUEAVEjAw?steps=32&angle=135
- Drawn as: linear gradient, 32 steps, 135 degrees
- Kinds: dark to light, vivid, warm
- Hues: monochromatic
- Contrast of its darkest and lightest colors: 6 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 | `#080404` | `oklch(11.81% 0.0096 25.31)` | Pupil | white, 20.3 to 1 |
| 2 | `#0c0505` | `oklch(12.86% 0.0151 25.30)` | Liquorice | white, 20.1 to 1 |
| 3 | `#120606` | `oklch(14.23% 0.0223 25.26)` | Knight Rider | white, 19.9 to 1 |
| 4 | `#180706` | `oklch(15.86% 0.0309 25.22)` | Asphalt | white, 19.5 to 1 |
| 5 | `#200908` | `oklch(17.68% 0.0404 25.18)` | Italian Roast | white, 19 to 1 |
| 6 | `#280a09` | `oklch(19.64% 0.0507 25.16)` | Root Brew | white, 18.4 to 1 |
| 7 | `#310b0a` | `oklch(21.67% 0.0614 25.17)` | 3AM Breakup | white, 17.7 to 1 |
| 8 | `#3a0c0c` | `oklch(23.70% 0.0721 25.23)` | Red Bean | white, 16.9 to 1 |
| 9 | `#430d0d` | `oklch(25.69% 0.0825 25.35)` | English Breakfast | white, 16.1 to 1 |
| 10 | `#4d0d0e` | `oklch(27.76% 0.0937 25.55)` | Minotaur Hide | white, 15.2 to 1 |
| 11 | `#570d0e` | `oklch(29.95% 0.1057 25.80)` | Mama Africa | white, 14.2 to 1 |
| 12 | `#620c0e` | `oklch(32.21% 0.1181 26.10)` | Blood Organ | white, 13.2 to 1 |
| 13 | `#6e0b0e` | `oklch(34.50% 0.1306 26.43)` | Port Wine | white, 12.2 to 1 |
| 14 | `#79090e` | `oklch(36.77% 0.1428 26.75)` | Secret Scarlet | white, 11.2 to 1 |
| 15 | `#84070d` | `oklch(38.99% 0.1543 27.05)` | Proton Red | white, 10.3 to 1 |
| 16 | `#8f050c` | `oklch(41.12% 0.1648 27.32)` | Stizza | white, 9.5 to 1 |
| 17 | `#99030c` | `oklch(43.11% 0.1740 27.51)` | Redwing | white, 8.8 to 1 |
| 18 | `#a3020c` | `oklch(45.04% 0.1829 27.60)` | Dear Darling | white, 8.1 to 1 |
| 19 | `#ad010c` | `oklch(46.93% 0.1913 27.62)` | Red Door | white, 7.5 to 1 |
| 20 | `#b6000d` | `oklch(48.77% 0.1991 27.63)` | Red Lust | white, 7 to 1 |
| 21 | `#bf010f` | `oklch(50.54% 0.2061 27.65)` | Free Speech Red | white, 6.5 to 1 |
| 22 | `#c70410` | `oklch(52.26% 0.2121 27.74)` | Venetian Red | white, 6 to 1 |
| 23 | `#cf0a12` | `oklch(53.92% 0.2167 27.96)` | Hypnotic Red | white, 5.6 to 1 |
| 24 | `#d61314` | `oklch(55.52% 0.2199 28.35)` | Dragon’s Lair | white, 5.3 to 1 |
| 25 | `#dc1d16` | `oklch(57.08% 0.2212 28.98)` | Snake Fruit | white, 4.9 to 1 |
| 26 | `#e12818` | `oklch(58.66% 0.2202 29.87)` | Ferocious | white, 4.6 to 1 |
| 27 | `#e6321b` | `oklch(60.22% 0.2176 30.94)` | Satan | black, 4.8 to 1 |
| 28 | `#ea3c1f` | `oklch(61.71% 0.2138 32.10)` | Chilli Crab | black, 5.1 to 1 |
| 29 | `#ed4522` | `oklch(63.09% 0.2096 33.26)` | Heating Lamp | black, 5.4 to 1 |
| 30 | `#ef4d26` | `oklch(64.31% 0.2054 34.34)` | Hot Shot | black, 5.7 to 1 |
| 31 | `#f25329` | `oklch(65.35% 0.2020 35.24)` | Fiery Glow | black, 6 to 1 |
| 32 | `#f3572b` | `oklch(66.14% 0.1998 35.88)` | Hot Embers | black, 6.2 to 1 |

## CSS

```css
background: linear-gradient(135deg, #080404 0.0%, #0c0505 3.2%, #120606 6.5%, #180706 9.7%, #200908 12.9%, #280a09 16.1%, #310b0a 19.4%, #3a0c0c 22.6%, #430d0d 25.8%, #4d0d0e 29.0%, #570d0e 32.3%, #620c0e 35.5%, #6e0b0e 38.7%, #79090e 41.9%, #84070d 45.2%, #8f050c 48.4%, #99030c 51.6%, #a3020c 54.8%, #ad010c 58.1%, #b6000d 61.3%, #bf010f 64.5%, #c70410 67.7%, #cf0a12 71.0%, #d61314 74.2%, #dc1d16 77.4%, #e12818 80.6%, #e6321b 83.9%, #ea3c1f 87.1%, #ed4522 90.3%, #ef4d26 93.5%, #f25329 96.8%, #f3572b 100.0%);
background: linear-gradient(135deg in oklch, oklch(11.81% 0.0096 25.31) 0.0%, oklch(12.86% 0.0151 25.30) 3.2%, oklch(14.23% 0.0223 25.26) 6.5%, oklch(15.86% 0.0309 25.22) 9.7%, oklch(17.68% 0.0404 25.18) 12.9%, oklch(19.64% 0.0507 25.16) 16.1%, oklch(21.67% 0.0614 25.17) 19.4%, oklch(23.70% 0.0721 25.23) 22.6%, oklch(25.69% 0.0825 25.35) 25.8%, oklch(27.76% 0.0937 25.55) 29.0%, oklch(29.95% 0.1057 25.80) 32.3%, oklch(32.21% 0.1181 26.10) 35.5%, oklch(34.50% 0.1306 26.43) 38.7%, oklch(36.77% 0.1428 26.75) 41.9%, oklch(38.99% 0.1543 27.05) 45.2%, oklch(41.12% 0.1648 27.32) 48.4%, oklch(43.11% 0.1740 27.51) 51.6%, oklch(45.04% 0.1829 27.60) 54.8%, oklch(46.93% 0.1913 27.62) 58.1%, oklch(48.77% 0.1991 27.63) 61.3%, oklch(50.54% 0.2061 27.65) 64.5%, oklch(52.26% 0.2121 27.74) 67.7%, oklch(53.92% 0.2167 27.96) 71.0%, oklch(55.52% 0.2199 28.35) 74.2%, oklch(57.08% 0.2212 28.98) 77.4%, oklch(58.66% 0.2202 29.87) 80.6%, oklch(60.22% 0.2176 30.94) 83.9%, oklch(61.71% 0.2138 32.10) 87.1%, oklch(63.09% 0.2096 33.26) 90.3%, oklch(64.31% 0.2054 34.34) 93.5%, oklch(65.35% 0.2020 35.24) 96.8%, oklch(66.14% 0.1998 35.88) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.118 | 0.01 | 25.3 |
| 2 | 0.252 | 0.08 | 25.3 |
| 3 | 0.421 | 0.169 | 27.4 |
| 4 | 0.559 | 0.22 | 28.5 |
| 5 | 0.661 | 0.2 | 35.9 |

## In these collections

- [Black Friday gradients](https://grabient.com/black-friday-gradients)

## Other forms

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