# Warm brown, orange, beige and purple linear gradient

Warm brown, orange, beige and purple linear gradient with 7 colors: #2e2622, #a74f2c, #fe8a00, #faca36, #fbe5b5, #c8a492, #6d254e. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kWRgoh1D6_m06xVxjT4MSk1w`
- Page: https://grabient.com/kWRgoh1D6_m06xVxjT4MSk1w
- Drawn as: linear gradient, 7 steps, 90 degrees
- Kinds: light center, vivid, warm, multicolor
- Hues: wide
- Contrast of its darkest and lightest colors: 12 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 | `#2e2622` | `oklch(27.56% 0.0138 47.11)` | Wood Bark | white, 14.8 to 1 |
| 2 | `#a74f2c` | `oklch(53.25% 0.1261 41.51)` | Alfajor Brown | white, 5.5 to 1 |
| 3 | `#fe8a00` | `oklch(74.70% 0.1793 57.74)` | American Orange | black, 8.8 to 1 |
| 4 | `#faca36` | `oklch(85.83% 0.1612 89.38)` | Banana Boat | black, 13.5 to 1 |
| 5 | `#fbe5b5` | `oklch(92.81% 0.0669 86.25)` | They Call It Mellow | black, 16.9 to 1 |
| 6 | `#c8a492` | `oklch(74.58% 0.0494 46.99)` | Sombrero Tan | black, 9.1 to 1 |
| 7 | `#6d254e` | `oklch(38.58% 0.1130 347.93)` | Ebizome Purple | white, 10.3 to 1 |

## CSS

```css
background: linear-gradient(90deg, #2e2622 0.0%, #a74f2c 16.7%, #fe8a00 33.3%, #faca36 50.0%, #fbe5b5 66.7%, #c8a492 83.3%, #6d254e 100.0%);
background: linear-gradient(90deg in oklch, oklch(27.56% 0.0138 47.11) 0.0%, oklch(53.25% 0.1261 41.51) 16.7%, oklch(74.70% 0.1793 57.74) 33.3%, oklch(85.83% 0.1612 89.38) 50.0%, oklch(92.81% 0.0669 86.25) 66.7%, oklch(74.58% 0.0494 46.99) 83.3%, oklch(38.58% 0.1130 347.93) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.276 | 0.014 | 47.1 |
| 2 | 0.661 | 0.172 | 43.9 |
| 3 | 0.858 | 0.161 | 89.4 |
| 4 | 0.894 | 0.036 | 73.5 |
| 5 | 0.386 | 0.113 | -12.1 |

## In these collections

- [Day of the Dead swatches](https://grabient.com/day-of-the-dead-swatches)
- [Secondary color swatches](https://grabient.com/secondary-color-swatches)

## Other forms

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