# Black and gold gradient

Monochrome black to beige linear gradient with 32 colors: #0c0906, #0f0b07, #130e08, #18120a, #1d160c, #241b0f, #2b2111, #332614, #3c2c16, #453318, #503a1a, #5b421b, #674b1c, #74541d, #805d1d, #8b661f, #966f21, #a07824, #ab8227, #b58b2b, #bf9530, #c89e36, #d0a73e, #d7b047, #ddb952, #e2c15f, #e7c96e, #ead07d, #edd78b, #f0dd97, #f2e2a1, #f5e6a8. Edit it and copy or download CSS, SVG, PNG or shader code.

- Also called: Monochrome black to beige linear gradient
- Seed: `kWJAc5Jg6_UYkwJjL0D9R1Aw`
- Page: https://grabient.com/kWJAc5Jg6_UYkwJjL0D9R1Aw?steps=32
- Drawn as: linear gradient, 32 steps, 90 degrees
- Kinds: dark to light, vivid, warm, monochrome
- Hues: monochromatic
- Contrast of its darkest and lightest colors: 15.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 | `#0c0906` | `oklch(14.17% 0.0096 80.16)` | Badab Black Wash | white, 19.8 to 1 |
| 2 | `#0f0b07` | `oklch(15.37% 0.0119 79.66)` | Smoky Black | white, 19.5 to 1 |
| 3 | `#130e08` | `oklch(16.89% 0.0146 78.91)` | Balsamico | white, 19.1 to 1 |
| 4 | `#18120a` | `oklch(18.69% 0.0178 78.01)` | Black Raspberry | white, 18.5 to 1 |
| 5 | `#1d160c` | `oklch(20.74% 0.0215 77.07)` | Soulless | white, 17.8 to 1 |
| 6 | `#241b0f` | `oklch(23.00% 0.0257 76.18)` | Burnt Coffee | white, 16.9 to 1 |
| 7 | `#2b2111` | `oklch(25.42% 0.0305 75.45)` | Coffee Grounds | white, 15.8 to 1 |
| 8 | `#332614` | `oklch(27.96% 0.0357 74.99)` | Black Slug | white, 14.6 to 1 |
| 9 | `#3c2c16` | `oklch(30.59% 0.0415 74.88)` | Vanilla Bean Brown | white, 13.4 to 1 |
| 10 | `#453318` | `oklch(33.48% 0.0484 75.09)` | Iroko | white, 12 to 1 |
| 11 | `#503a1a` | `oklch(36.62% 0.0563 75.54)` | Avocado Stone | white, 10.6 to 1 |
| 12 | `#5b421b` | `oklch(39.94% 0.0649 76.18)` | Smoked Oak Brown | white, 9.3 to 1 |
| 13 | `#674b1c` | `oklch(43.37% 0.0737 76.96)` | Black Queen | white, 8 to 1 |
| 14 | `#74541d` | `oklch(46.83% 0.0823 77.84)` | Lizard Brown | white, 6.9 to 1 |
| 15 | `#805d1d` | `oklch(50.25% 0.0904 78.77)` | Sleek Otter | white, 6 to 1 |
| 16 | `#8b661f` | `oklch(53.54% 0.0975 79.71)` | Hunting Jacket | white, 5.2 to 1 |
| 17 | `#966f21` | `oklch(56.67% 0.1035 80.61)` | Chamois Yellow | black, 4.5 to 1 |
| 18 | `#a07824` | `oklch(59.82% 0.1094 81.61)` | Nataneyu Gold | black, 5.2 to 1 |
| 19 | `#ab8227` | `oklch(62.96% 0.1150 82.69)` | Burnt Honey | black, 5.9 to 1 |
| 20 | `#b58b2b` | `oklch(66.08% 0.1202 83.82)` | Mineral Umber | black, 6.7 to 1 |
| 21 | `#bf9530` | `oklch(69.11% 0.1246 84.98)` | Leisure | black, 7.5 to 1 |
| 22 | `#c89e36` | `oklch(72.03% 0.1278 86.14)` | Local Curry | black, 8.4 to 1 |
| 23 | `#d0a73e` | `oklch(74.79% 0.1297 87.27)` | Brassed Off | black, 9.3 to 1 |
| 24 | `#d7b047` | `oklch(77.35% 0.1298 88.35)` | Golden Rule | black, 10.2 to 1 |
| 25 | `#ddb952` | `oklch(79.73% 0.1276 89.40)` | Golden Bass | black, 11.1 to 1 |
| 26 | `#e2c15f` | `oklch(82.02% 0.1227 90.50)` | Candelabra | black, 12 to 1 |
| 27 | `#e7c96e` | `oklch(84.20% 0.1157 91.61)` | Bee Pollen | black, 12.9 to 1 |
| 28 | `#ead07d` | `oklch(86.23% 0.1076 92.70)` | Choux à la Crème | black, 13.8 to 1 |
| 29 | `#edd78b` | `oklch(88.07% 0.0991 93.73)` | Natural Yellow | black, 14.7 to 1 |
| 30 | `#f0dd97` | `oklch(89.69% 0.0911 94.65)` | Gold Bullion | black, 15.4 to 1 |
| 31 | `#f2e2a1` | `oklch(91.05% 0.0845 95.42)` | Sugar Cookie | black, 16.1 to 1 |
| 32 | `#f5e6a8` | `oklch(92.13% 0.0799 96.01)` | Gold Sand | black, 16.7 to 1 |

## CSS

```css
background: linear-gradient(90deg, #0c0906 0.0%, #0f0b07 3.2%, #130e08 6.5%, #18120a 9.7%, #1d160c 12.9%, #241b0f 16.1%, #2b2111 19.4%, #332614 22.6%, #3c2c16 25.8%, #453318 29.0%, #503a1a 32.3%, #5b421b 35.5%, #674b1c 38.7%, #74541d 41.9%, #805d1d 45.2%, #8b661f 48.4%, #966f21 51.6%, #a07824 54.8%, #ab8227 58.1%, #b58b2b 61.3%, #bf9530 64.5%, #c89e36 67.7%, #d0a73e 71.0%, #d7b047 74.2%, #ddb952 77.4%, #e2c15f 80.6%, #e7c96e 83.9%, #ead07d 87.1%, #edd78b 90.3%, #f0dd97 93.5%, #f2e2a1 96.8%, #f5e6a8 100.0%);
background: linear-gradient(90deg in oklch, oklch(14.17% 0.0096 80.16) 0.0%, oklch(15.37% 0.0119 79.66) 3.2%, oklch(16.89% 0.0146 78.91) 6.5%, oklch(18.69% 0.0178 78.01) 9.7%, oklch(20.74% 0.0215 77.07) 12.9%, oklch(23.00% 0.0257 76.18) 16.1%, oklch(25.42% 0.0305 75.45) 19.4%, oklch(27.96% 0.0357 74.99) 22.6%, oklch(30.59% 0.0415 74.88) 25.8%, oklch(33.48% 0.0484 75.09) 29.0%, oklch(36.62% 0.0563 75.54) 32.3%, oklch(39.94% 0.0649 76.18) 35.5%, oklch(43.37% 0.0737 76.96) 38.7%, oklch(46.83% 0.0823 77.84) 41.9%, oklch(50.25% 0.0904 78.77) 45.2%, oklch(53.54% 0.0975 79.71) 48.4%, oklch(56.67% 0.1035 80.61) 51.6%, oklch(59.82% 0.1094 81.61) 54.8%, oklch(62.96% 0.1150 82.69) 58.1%, oklch(66.08% 0.1202 83.82) 61.3%, oklch(69.11% 0.1246 84.98) 64.5%, oklch(72.03% 0.1278 86.14) 67.7%, oklch(74.79% 0.1297 87.27) 71.0%, oklch(77.35% 0.1298 88.35) 74.2%, oklch(79.73% 0.1276 89.40) 77.4%, oklch(82.02% 0.1227 90.50) 80.6%, oklch(84.20% 0.1157 91.61) 83.9%, oklch(86.23% 0.1076 92.70) 87.1%, oklch(88.07% 0.0991 93.73) 90.3%, oklch(89.69% 0.0911 94.65) 93.5%, oklch(91.05% 0.0845 95.42) 96.8%, oklch(92.13% 0.0799 96.01) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.142 | 0.01 | 80.2 |
| 2 | 0.299 | 0.04 | 74.9 |
| 3 | 0.551 | 0.101 | 80.2 |
| 4 | 0.78 | 0.13 | 88.6 |
| 5 | 0.921 | 0.08 | 96 |

## In these collections

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

## Other forms

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