# Orange, gold and stone light palette

The Orange, gold and stone light palette brings together off-white, pale orange, light orange, light red, and light gray. The colors span a narrow lightness range, combining restrained color with gentle contrast. Its light and open character suits brand mood boards and editorial graphics. Its darkest tone is light gray, and its lightest tone is off-white.

- Also called: Analogous white, beige, pink and gray linear swatches
- Seed: `kW-Q8ndhY__EWQvsFjjZwe_4`
- Page: https://grabient.com/kW-Q8ndhY__EWQvsFjjZwe_4?style=linearSwatches&steps=5
- Drawn as: linear swatches, 5 steps, 90 degrees
- Kinds: pastel, light, warm
- Hues: analogous
- Contrast of its darkest and lightest colors: 1.7 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 | `#fff7f1` | `oklch(98.03% 0.0113 54.88)` | Seashell | black, 19.8 to 1 |
| 2 | `#ffe1ce` | `oklch(92.91% 0.0423 54.85)` | Autumn Bloom | black, 16.8 to 1 |
| 3 | `#f0d7ae` | `oklch(88.98% 0.0606 80.21)` | Homey Cream | black, 15 to 1 |
| 4 | `#f3bfbe` | `oklch(85.04% 0.0606 19.97)` | Silver Strawberry | black, 12.9 to 1 |
| 5 | `#cebcbc` | `oklch(81.10% 0.0207 19.97)` | Silentropae Cloud | black, 11.5 to 1 |

## CSS

```css
background: linear-gradient(90deg, #fff7f1 0.000% 20.000%, #ffe1ce 20.000% 40.000%, #f0d7ae 40.000% 60.000%, #f3bfbe 60.000% 80.000%, #cebcbc 80.000% 100.000%);
background: linear-gradient(90deg, oklch(98.03% 0.0113 54.88) 0.000% 20.000%, oklch(92.91% 0.0423 54.85) 20.000% 40.000%, oklch(88.98% 0.0606 80.21) 40.000% 60.000%, oklch(85.04% 0.0606 19.97) 60.000% 80.000%, oklch(81.10% 0.0207 19.97) 80.000% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.98 | 0.021 | 54.8 |
| 2 | 0.929 | 0.061 | 54.8 |
| 3 | 0.89 | 0.061 | 80.2 |
| 4 | 0.85 | 0.061 | 20 |
| 5 | 0.811 | 0.021 | 20 |

## In these collections

- [Light swatches](https://grabient.com/light-swatches)

## Other forms

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