# Burgundy and orange color palette

The Burgundy and orange color palette brings together dark red, red, and orange. The colors span a broad lightness range, combining strong color with clear contrast. Its bold and dramatic character suits brand mood boards and editorial graphics. Its darkest tone is dark red, and its lightest tone is orange.

- Also called: Vivid analogous maroon to orange linear gradient
- Seed: `kURVAVOcHAFJLwPivcLg`
- Page: https://grabient.com/kURVAVOcHAFJLwPivcLg?steps=4&angle=45
- Drawn as: linear gradient, 4 steps, 45 degrees
- Kinds: dark to light, vivid, warm
- Hues: analogous
- Contrast of its darkest and lightest colors: 7.3 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 | `#500100` | `oklch(27.17% 0.1102 29.53)` | Umbral Umber | white, 15.6 to 1 |
| 2 | `#a20f00` | `oklch(45.28% 0.1788 30.54)` | Gory Red | white, 8 to 1 |
| 3 | `#f05000` | `oklch(64.57% 0.2068 39.02)` | Orangealicious | black, 5.8 to 1 |
| 4 | `#ff9b19` | `oklch(77.56% 0.1695 64.40)` | Hephaestus Gold | black, 9.9 to 1 |

## CSS

```css
background: linear-gradient(45deg, #500100 0.0%, #a20f00 33.3%, #f05000 66.7%, #ff9b19 100.0%);
background: linear-gradient(45deg in oklch, oklch(27.17% 0.1102 29.53) 0.0%, oklch(45.28% 0.1788 30.54) 33.3%, oklch(64.57% 0.2068 39.02) 66.7%, oklch(77.56% 0.1695 64.40) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.272 | 0.11 | 29.5 |
| 2 | 0.453 | 0.181 | 30.6 |
| 3 | 0.646 | 0.208 | 39 |
| 4 | 0.776 | 0.169 | 64.4 |

## In these collections

- [Diwali swatches](https://grabient.com/diwali-swatches)
- [Persimmon gradients](https://grabient.com/persimmon-gradients)

## Other forms

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