# Bronze and mustard yellow palette

The Bronze and mustard yellow palette brings together gold and yellow. The colors span a moderate lightness range, combining strong color with clear contrast. Its bold and dramatic character suits brand mood boards and editorial graphics. Its darkest tone is gold, and its lightest tone is yellow.

- Also called: Vivid monochrome olive to yellow linear gradient
- Seed: `kUdERJTaxA2E0QFyukAA`
- Page: https://grabient.com/kUdERJTaxA2E0QFyukAA?steps=5&angle=135
- Drawn as: linear gradient, 5 steps, 135 degrees
- Kinds: dark to light, vivid, monochrome
- Hues: analogous
- Contrast of its darkest and lightest colors: 5.4 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 | `#615905` | `oklch(45.67% 0.0937 102.66)` | Ayahuasca Vine | white, 7.1 to 1 |
| 2 | `#7d7b19` | `oklch(56.83% 0.1141 108.33)` | Tool Green | black, 4.7 to 1 |
| 3 | `#9da231` | `oklch(68.80% 0.1330 112.03)` | Forest Lichen | black, 7.6 to 1 |
| 4 | `#bec94b` | `oklch(80.26% 0.1482 113.66)` | Forsythia Bud | black, 11.6 to 1 |
| 5 | `#ddea62` | `oklch(90.16% 0.1598 114.28)` | Mindaro | black, 16 to 1 |

## CSS

```css
background: linear-gradient(135deg, #615905 0.0%, #7d7b19 25.0%, #9da231 50.0%, #bec94b 75.0%, #ddea62 100.0%);
background: linear-gradient(135deg in oklch, oklch(45.67% 0.0937 102.66) 0.0%, oklch(56.83% 0.1141 108.33) 25.0%, oklch(68.80% 0.1330 112.03) 50.0%, oklch(80.26% 0.1482 113.66) 75.0%, oklch(90.16% 0.1598 114.28) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.457 | 0.094 | 102.7 |
| 2 | 0.61 | 0.121 | 110.1 |
| 3 | 0.764 | 0.143 | 113.2 |
| 4 | 0.902 | 0.16 | 114.3 |

## In these collections

- [Yellow gradients](https://grabient.com/yellow-gradients)

## Other forms

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