# Champagne and bronze color palette

The Champagne and bronze color palette brings together pale orange, orange, red, and gold. The colors span a broad lightness range, combining strong color with clear contrast. Its bold and dramatic character suits seasonal packaging and event invitations. Its darkest tone is orange, and its lightest tone is pale orange.

- Also called: Warm beige, orange, red and tan angular swatches
- Seed: `kW5Rk9ScU76ebPy7wbw4x1H4`
- Page: https://grabient.com/kW5Rk9ScU76ebPy7wbw4x1H4?style=angularSwatches&steps=5&angle=135
- Drawn as: angular swatches, 5 steps, 135 degrees
- Kinds: dark center, vivid, warm
- Hues: analogous
- Contrast of its darkest and lightest colors: 10 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 | `#e9ddc5` | `oklch(90.16% 0.0344 85.78)` | Heavy Cream | black, 15.6 to 1 |
| 2 | `#bc5b00` | `oklch(57.87% 0.1490 51.93)` | Dry Clay | black, 4.6 to 1 |
| 3 | `#4e220b` | `oklch(31.10% 0.0744 45.62)` | Evil Cigar | white, 13.4 to 1 |
| 4 | `#a70d3a` | `oklch(46.85% 0.1805 13.92)` | Hot Lava | white, 7.5 to 1 |
| 5 | `#d1b37c` | `oklch(77.95% 0.0799 81.55)` | Beachwalk | black, 10.4 to 1 |

## CSS

```css
background: conic-gradient(from 135deg, #e9ddc5 0.000% 20.000%, #bc5b00 20.000% 40.000%, #4e220b 40.000% 60.000%, #a70d3a 60.000% 80.000%, #d1b37c 80.000% 100.000%);
background: conic-gradient(from 135deg, oklch(90.16% 0.0344 85.78) 0.000% 20.000%, oklch(57.87% 0.1490 51.93) 20.000% 40.000%, oklch(31.10% 0.0744 45.62) 40.000% 60.000%, oklch(46.85% 0.1805 13.92) 60.000% 80.000%, oklch(77.95% 0.0799 81.55) 80.000% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.902 | 0.034 | 85.8 |
| 2 | 0.579 | 0.19 | 52 |
| 3 | 0.311 | 0.074 | 45.6 |
| 4 | 0.469 | 0.181 | 13.9 |
| 5 | 0.78 | 0.08 | 81.6 |

## In these collections

- [Warm swatches](https://grabient.com/warm-swatches)
- [Fall swatches](https://grabient.com/fall-swatches)
- [Thanksgiving swatches](https://grabient.com/thanksgiving-swatches)
- [Golden hour swatches](https://grabient.com/golden-hour-swatches)

## Other forms

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