# Champagne and bronze monochromatic palette

The Champagne and bronze monochromatic palette brings together pale yellow, light yellow, and gold. The colors span a broad lightness range, combining moderate color with clear contrast. Its light and open character suits brand mood boards and editorial graphics. Its darkest tone is gold, and its lightest tone is pale yellow.

- Also called: Analogous beige, yellow and brown linear swatches
- Seed: `kW9ytH9y4_u05v1Ysb7vSK_I`
- Page: https://grabient.com/kW9ytH9y4_u05v1Ysb7vSK_I?style=linearSwatches&steps=5
- Drawn as: linear swatches, 5 steps, 90 degrees
- Kinds: light to dark, vivid, light, warm
- Hues: monochromatic
- Contrast of its darkest and lightest colors: 6.1 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 | `#fef8ca` | `oklch(97.24% 0.0593 100.55)` | Lemon Chiffon | black, 19.4 to 1 |
| 2 | `#ffec89` | `oklch(93.70% 0.1212 98.44)` | Spätzle Yellow | black, 17.5 to 1 |
| 3 | `#f4cd3c` | `oklch(85.83% 0.1585 93.15)` | Basket of Gold | black, 13.6 to 1 |
| 4 | `#c4951b` | `oklch(69.69% 0.1364 84.70)` | Nugget Gold | black, 7.6 to 1 |
| 5 | `#7b560d` | `oklch(48.03% 0.0951 78.36)` | Autumn Leaf Brown | white, 6.6 to 1 |

## CSS

```css
background: linear-gradient(90deg, #fef8ca 0.000% 20.000%, #ffec89 20.000% 40.000%, #f4cd3c 40.000% 60.000%, #c4951b 60.000% 80.000%, #7b560d 80.000% 100.000%);
background: linear-gradient(90deg, oklch(97.24% 0.0593 100.55) 0.000% 20.000%, oklch(93.70% 0.1212 98.44) 20.000% 40.000%, oklch(85.83% 0.1585 93.15) 40.000% 60.000%, oklch(69.69% 0.1364 84.70) 60.000% 80.000%, oklch(48.03% 0.0951 78.36) 80.000% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.972 | 0.059 | 100.5 |
| 2 | 0.937 | 0.127 | 98.4 |
| 3 | 0.858 | 0.158 | 93.1 |
| 4 | 0.697 | 0.136 | 84.7 |
| 5 | 0.48 | 0.095 | 78.4 |

## In these collections

- [Monochromatic swatches](https://grabient.com/monochromatic-swatches)

## Other forms

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