# Analogous beige, orange and maroon angular gradient

Analogous beige, orange and maroon angular gradient with 32 colors: #e0db8d, #dfd886, #ded47d, #dece72, #dec865, #dec157, #deba48, #ddb238, #dda929, #dca01a, #da960a, #d88c00, #d58100, #d17700, #cd6c00, #c86303, #c35904, #bf4f03, #ba4401, #b43900, #af2e00, #a92200, #a21601, #9c0802, #940003, #8b0005, #830004, #7b0002, #740000, #6d0200, #670400, #620400. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kW30hLYbS9kw4u83P71qC3AA`
- Page: https://grabient.com/kW30hLYbS9kw4u83P71qC3AA?style=angularGradient&steps=32
- Drawn as: angular gradient, 32 steps, 90 degrees
- Kinds: light to dark, vivid, warm
- Hues: analogous
- Contrast of its darkest and lightest colors: 9.5 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 | `#e0db8d` | `oklch(87.80% 0.0992 105.47)` | Lively Laugh | black, 14.6 to 1 |
| 2 | `#dfd886` | `oklch(86.96% 0.1031 103.97)` | Gold Winged | black, 14.2 to 1 |
| 3 | `#ded47d` | `oklch(85.88% 0.1086 102.08)` | Golden Rice | black, 13.7 to 1 |
| 4 | `#dece72` | `oklch(84.60% 0.1151 99.84)` | Sand Pyramid | black, 13.2 to 1 |
| 5 | `#dec865` | `oklch(83.15% 0.1222 97.27)` | Williams Pear Yellow | black, 12.5 to 1 |
| 6 | `#dec157` | `oklch(81.57% 0.1292 94.42)` | Cream Gold | black, 11.8 to 1 |
| 7 | `#deba48` | `oklch(79.88% 0.1359 91.32)` | Credo | black, 11.1 to 1 |
| 8 | `#ddb238` | `oklch(78.12% 0.1415 88.00)` | Citronite | black, 10.4 to 1 |
| 9 | `#dda929` | `oklch(76.31% 0.1456 84.48)` | Baroque | black, 9.7 to 1 |
| 10 | `#dca01a` | `oklch(74.37% 0.1483 80.46)` | Grapefruit Yellow | black, 9 to 1 |
| 11 | `#da960a` | `oklch(72.28% 0.1502 75.94)` | Beige Red | black, 8.3 to 1 |
| 12 | `#d88c00` | `oklch(70.07% 0.1508 71.10)` | Fleur de Sel Caramel | black, 7.6 to 1 |
| 13 | `#d58100` | `oklch(67.79% 0.1508 66.14)` | Dulce de Leche | black, 6.9 to 1 |
| 14 | `#d17700` | `oklch(65.48% 0.1517 61.25)` | Autumn Leaf Orange | black, 6.3 to 1 |
| 15 | `#cd6c00` | `oklch(63.18% 0.1535 56.61)` | Sludge | black, 5.7 to 1 |
| 16 | `#c86303` | `oklch(60.94% 0.1548 52.41)` | Kvass | black, 5.2 to 1 |
| 17 | `#c35904` | `oklch(58.76% 0.1569 48.72)` | Rust Orange | black, 4.7 to 1 |
| 18 | `#bf4f03` | `oklch(56.55% 0.1600 45.23)` | Crustose Lichen | white, 4.8 to 1 |
| 19 | `#ba4401` | `oklch(54.31% 0.1637 41.90)` | Bolognese | white, 5.3 to 1 |
| 20 | `#b43900` | `oklch(52.08% 0.1677 38.77)` | Azshara Vein | white, 5.9 to 1 |
| 21 | `#af2e00` | `oklch(49.89% 0.1711 35.93)` | Rusty Red | white, 6.5 to 1 |
| 22 | `#a92200` | `oklch(47.75% 0.1742 33.45)` | Saveloy | white, 7.2 to 1 |
| 23 | `#a21601` | `oklch(45.70% 0.1757 31.38)` | Gory Red | white, 7.8 to 1 |
| 24 | `#9c0802` | `oklch(43.77% 0.1754 29.72)` | Bloodthirsty Vampire | white, 8.5 to 1 |
| 25 | `#940003` | `oklch(41.94% 0.1718 28.65)` | Carnage Red | white, 9.2 to 1 |
| 26 | `#8b0005` | `oklch(40.10% 0.1640 28.18)` | Blood Omen | white, 9.9 to 1 |
| 27 | `#830004` | `oklch(38.30% 0.1567 28.21)` | Dark Red | white, 10.6 to 1 |
| 28 | `#7b0002` | `oklch(36.59% 0.1498 28.58)` | Demon | white, 11.4 to 1 |
| 29 | `#740000` | `oklch(35.01% 0.1436 29.15)` | Chaotic Red | white, 12 to 1 |
| 30 | `#6d0200` | `oklch(33.59% 0.1363 29.60)` | Khorne Red | white, 12.7 to 1 |
| 31 | `#670400` | `oklch(32.41% 0.1298 30.06)` | Red Blood | white, 13.2 to 1 |
| 32 | `#620400` | `oklch(31.50% 0.1253 30.29)` | Vampire Hunter | white, 13.6 to 1 |

## CSS

```css
background: conic-gradient(from 90deg, #e0db8d 0.0%, #dfd886 3.2%, #ded47d 6.5%, #dece72 9.7%, #dec865 12.9%, #dec157 16.1%, #deba48 19.4%, #ddb238 22.6%, #dda929 25.8%, #dca01a 29.0%, #da960a 32.3%, #d88c00 35.5%, #d58100 38.7%, #d17700 41.9%, #cd6c00 45.2%, #c86303 48.4%, #c35904 51.6%, #bf4f03 54.8%, #ba4401 58.1%, #b43900 61.3%, #af2e00 64.5%, #a92200 67.7%, #a21601 71.0%, #9c0802 74.2%, #940003 77.4%, #8b0005 80.6%, #830004 83.9%, #7b0002 87.1%, #740000 90.3%, #6d0200 93.5%, #670400 96.8%, #620400 100.0%);
background: conic-gradient(from 90deg in oklch, oklch(87.80% 0.0992 105.47) 0.0%, oklch(86.96% 0.1031 103.97) 3.2%, oklch(85.88% 0.1086 102.08) 6.5%, oklch(84.60% 0.1151 99.84) 9.7%, oklch(83.15% 0.1222 97.27) 12.9%, oklch(81.57% 0.1292 94.42) 16.1%, oklch(79.88% 0.1359 91.32) 19.4%, oklch(78.12% 0.1415 88.00) 22.6%, oklch(76.31% 0.1456 84.48) 25.8%, oklch(74.37% 0.1483 80.46) 29.0%, oklch(72.28% 0.1502 75.94) 32.3%, oklch(70.07% 0.1508 71.10) 35.5%, oklch(67.79% 0.1508 66.14) 38.7%, oklch(65.48% 0.1517 61.25) 41.9%, oklch(63.18% 0.1535 56.61) 45.2%, oklch(60.94% 0.1548 52.41) 48.4%, oklch(58.76% 0.1569 48.72) 51.6%, oklch(56.55% 0.1600 45.23) 54.8%, oklch(54.31% 0.1637 41.90) 58.1%, oklch(52.08% 0.1677 38.77) 61.3%, oklch(49.89% 0.1711 35.93) 64.5%, oklch(47.75% 0.1742 33.45) 67.7%, oklch(45.70% 0.1757 31.38) 71.0%, oklch(43.77% 0.1754 29.72) 74.2%, oklch(41.94% 0.1718 28.65) 77.4%, oklch(40.10% 0.1640 28.18) 80.6%, oklch(38.30% 0.1567 28.21) 83.9%, oklch(36.59% 0.1498 28.58) 87.1%, oklch(35.01% 0.1436 29.15) 90.3%, oklch(33.59% 0.1363 29.60) 93.5%, oklch(32.41% 0.1298 30.06) 96.8%, oklch(31.50% 0.1253 30.29) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.878 | 0.099 | 105.5 |
| 2 | 0.768 | 0.145 | 85.4 |
| 3 | 0.598 | 0.156 | 50.5 |
| 4 | 0.433 | 0.175 | 29.4 |
| 5 | 0.315 | 0.125 | 30.4 |

## In these collections

- [Orange gradients](https://grabient.com/orange-gradients)

## Other forms

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