# Ochre, crimson and near-black cyberpunk palette

The Ochre, crimson and near-black cyberpunk palette brings together gold, orange, red, and dark magenta. The colors span a very broad lightness range, combining strong color with high contrast. Its bold and dramatic character suits game interface concepts and stream graphics. Its darkest tone is dark magenta, and its lightest tone is gold.

- Also called: Analogous orange, maroon and black radial gradient
- Seed: `kY2GY83ki88nQPYzSLxora-w8Ou8`
- Page: https://grabient.com/kY2GY83ki88nQPYzSLxora-w8Ou8?style=radialGradient&steps=32&angle=135
- Drawn as: radial gradient, 32 steps, 135 degrees
- Kinds: light to dark, vivid, warm
- Hues: wide
- Contrast of its darkest and lightest colors: 12.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 | `#f8c655` | `oklch(85.04% 0.1406 85.08)` | Mom’s Pancake | black, 13.2 to 1 |
| 2 | `#f9c048` | `oklch(83.94% 0.1472 82.37)` | Sweet Lemon | black, 12.6 to 1 |
| 3 | `#fcb835` | `oklch(82.48% 0.1566 78.59)` | Glowing Lantern | black, 12 to 1 |
| 4 | `#ffad14` | `oklch(80.72% 0.1677 74.12)` | Clementine Jelly | black, 11.2 to 1 |
| 5 | `#ffa200` | `oklch(78.75% 0.1713 69.34)` | Pico Orange | black, 10.4 to 1 |
| 6 | `#fc9800` | `oklch(76.64% 0.1724 64.66)` | Jack-O | black, 9.6 to 1 |
| 7 | `#f98d00` | `oklch(74.45% 0.1738 60.45)` | Jú Huáng Tangerine | black, 8.8 to 1 |
| 8 | `#f48300` | `oklch(72.20% 0.1748 56.92)` | Romesco | black, 8.1 to 1 |
| 9 | `#ee7900` | `oklch(69.75% 0.1753 53.77)` | Mee-hua Sunset | black, 7.3 to 1 |
| 10 | `#e76e00` | `oklch(67.16% 0.1756 50.80)` | Clementine | black, 6.6 to 1 |
| 11 | `#df6400` | `oklch(64.47% 0.1760 47.84)` | Orange Danger | black, 5.9 to 1 |
| 12 | `#d85800` | `oklch(61.73% 0.1774 44.69)` | Exuberance | black, 5.3 to 1 |
| 13 | `#d14b00` | `oklch(58.97% 0.1808 41.16)` | Ōkaihau Express | black, 4.7 to 1 |
| 14 | `#cb3c00` | `oklch(56.20% 0.1880 37.03)` | Sauce Piquante | white, 5 to 1 |
| 15 | `#c62200` | `oklch(53.30% 0.2012 32.15)` | Minestrone | white, 5.7 to 1 |
| 16 | `#be0014` | `oklch(50.32% 0.2050 26.90)` | Red Tolumnia Orchid | white, 6.5 to 1 |
| 17 | `#ae0026` | `oklch(47.34% 0.1906 21.55)` | Jester Red | white, 7.4 to 1 |
| 18 | `#9e002f` | `oklch(44.44% 0.1778 16.52)` | Petal of a Dying Rose | white, 8.3 to 1 |
| 19 | `#900033` | `oklch(41.71% 0.1667 12.19)` | Madrileño Maroon | white, 9.3 to 1 |
| 20 | `#840034` | `oklch(39.21% 0.1569 8.95)` | Macabre | white, 10.3 to 1 |
| 21 | `#790032` | `oklch(36.97% 0.1482 7.08)` | Bordeaux | white, 11.2 to 1 |
| 22 | `#70002f` | `oklch(34.91% 0.1401 6.12)` | Merlot | white, 12.1 to 1 |
| 23 | `#67002b` | `oklch(32.95% 0.1323 5.49)` | Plum Cheese | white, 13 to 1 |
| 24 | `#5e0028` | `oklch(30.99% 0.1246 4.62)` | Baal Red Wash | white, 13.9 to 1 |
| 25 | `#550026` | `oklch(28.95% 0.1167 2.93)` | Fig Balsamic | white, 14.8 to 1 |
| 26 | `#4b0024` | `oklch(26.73% 0.1084 359.86)` | Blaze It Dark Magenta | white, 15.8 to 1 |
| 27 | `#400022` | `oklch(24.15% 0.0992 354.95)` | Blaze It Dark Magenta | white, 16.9 to 1 |
| 28 | `#330020` | `oklch(21.32% 0.0894 348.72)` | Vienna Roast | white, 18 to 1 |
| 29 | `#28001c` | `oklch(18.46% 0.0795 341.91)` | Black Sabbath | white, 19 to 1 |
| 30 | `#1d0018` | `oklch(15.71% 0.0695 335.23)` | Belladonna | white, 19.7 to 1 |
| 31 | `#130112` | `oklch(13.44% 0.0521 329.59)` | Glossy Black | white, 20.1 to 1 |
| 32 | `#0c020d` | `oklch(11.81% 0.0400 325.67)` | Broken Tube | white, 20.4 to 1 |

## CSS

```css
background: radial-gradient(circle at 50% 50%, #f8c655 0.0%, #f9c048 3.2%, #fcb835 6.5%, #ffad14 9.7%, #ffa200 12.9%, #fc9800 16.1%, #f98d00 19.4%, #f48300 22.6%, #ee7900 25.8%, #e76e00 29.0%, #df6400 32.3%, #d85800 35.5%, #d14b00 38.7%, #cb3c00 41.9%, #c62200 45.2%, #be0014 48.4%, #ae0026 51.6%, #9e002f 54.8%, #900033 58.1%, #840034 61.3%, #790032 64.5%, #70002f 67.7%, #67002b 71.0%, #5e0028 74.2%, #550026 77.4%, #4b0024 80.6%, #400022 83.9%, #330020 87.1%, #28001c 90.3%, #1d0018 93.5%, #130112 96.8%, #0c020d 100.0%);
background: radial-gradient(circle at 50% 50% in oklch, oklch(85.04% 0.1406 85.08) 0.0%, oklch(83.94% 0.1472 82.37) 3.2%, oklch(82.48% 0.1566 78.59) 6.5%, oklch(80.72% 0.1677 74.12) 9.7%, oklch(78.75% 0.1713 69.34) 12.9%, oklch(76.64% 0.1724 64.66) 16.1%, oklch(74.45% 0.1738 60.45) 19.4%, oklch(72.20% 0.1748 56.92) 22.6%, oklch(69.75% 0.1753 53.77) 25.8%, oklch(67.16% 0.1756 50.80) 29.0%, oklch(64.47% 0.1760 47.84) 32.3%, oklch(61.73% 0.1774 44.69) 35.5%, oklch(58.97% 0.1808 41.16) 38.7%, oklch(56.20% 0.1880 37.03) 41.9%, oklch(53.30% 0.2012 32.15) 45.2%, oklch(50.32% 0.2050 26.90) 48.4%, oklch(47.34% 0.1906 21.55) 51.6%, oklch(44.44% 0.1778 16.52) 54.8%, oklch(41.71% 0.1667 12.19) 58.1%, oklch(39.21% 0.1569 8.95) 61.3%, oklch(36.97% 0.1482 7.08) 64.5%, oklch(34.91% 0.1401 6.12) 67.7%, oklch(32.95% 0.1323 5.49) 71.0%, oklch(30.99% 0.1246 4.62) 74.2%, oklch(28.95% 0.1167 2.93) 77.4%, oklch(26.73% 0.1084 359.86) 80.6%, oklch(24.15% 0.0992 354.95) 83.9%, oklch(21.32% 0.0894 348.72) 87.1%, oklch(18.46% 0.0795 341.91) 90.3%, oklch(15.71% 0.0695 335.23) 93.5%, oklch(13.44% 0.0521 329.59) 96.8%, oklch(11.81% 0.0400 325.67) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.85 | 0.141 | 85.1 |
| 2 | 0.74 | 0.2 | 59.7 |
| 3 | 0.579 | 0.22 | 39.6 |
| 4 | 0.402 | 0.2 | 10 |
| 5 | 0.272 | 0.15 | 0.5 |
| 6 | 0.118 | 0.04 | -34.3 |

## In these collections

- [Cyberpunk gradients](https://grabient.com/cyberpunk-gradients)

## Other forms

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