# Gold yellow palette

The Gold yellow palette brings together pale yellow, gold, and orange. The colors span a narrow lightness range, combining moderate color with gentle contrast. Its light and open character suits brand mood boards and editorial graphics. Its darkest tone is orange, and its lightest tone is pale yellow.

- Also called: Vivid beige, yellow and orange linear gradient
- Seed: `kS70NDb7G--i4vq`
- Page: https://grabient.com/kS70NDb7G--i4vq?steps=6&angle=315
- Drawn as: linear gradient, 6 steps, 315 degrees
- Kinds: even lightness, vivid, light, warm
- Hues: monochromatic
- Contrast of its darkest and lightest colors: 1.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 | `#ffeba5` | `oklch(94.09% 0.0905 94.23)` | Rite of Spring | black, 17.7 to 1 |
| 2 | `#ffe38f` | `oklch(91.99% 0.1080 91.55)` | Banana Republic | black, 16.5 to 1 |
| 3 | `#ffd671` | `oklch(89.11% 0.1285 87.73)` | Quiche Lorraine | black, 15.1 to 1 |
| 4 | `#ffca59` | `oklch(86.55% 0.1416 83.62)` | Nacho | black, 13.8 to 1 |
| 5 | `#ffbe46` | `oklch(84.05% 0.1501 78.77)` | Twenty Carat | black, 12.6 to 1 |
| 6 | `#ffb539` | `oklch(82.28% 0.1557 75.20)` | Corona | black, 11.8 to 1 |

## CSS

```css
background: linear-gradient(315deg, #ffeba5 0.0%, #ffe38f 20.0%, #ffd671 40.0%, #ffca59 60.0%, #ffbe46 80.0%, #ffb539 100.0%);
background: linear-gradient(315deg in oklch, oklch(94.09% 0.0905 94.23) 0.0%, oklch(91.99% 0.1080 91.55) 20.0%, oklch(89.11% 0.1285 87.73) 40.0%, oklch(86.55% 0.1416 83.62) 60.0%, oklch(84.05% 0.1501 78.77) 80.0%, oklch(82.28% 0.1557 75.20) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.941 | 0.092 | 94.2 |
| 2 | 0.878 | 0.136 | 85.8 |
| 3 | 0.823 | 0.156 | 75.2 |

## In these collections

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

## Other forms

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