# Ochre, orange and wine jewel tones palette

The Ochre, orange and wine jewel tones palette brings together gold, orange, and dark magenta. The colors span a broad lightness range, combining moderate color with clear contrast. Its balanced and composed character suits brand mood boards and editorial graphics. Its darkest tone is dark magenta, and its lightest tone is gold.

- Also called: Yellow, orange, brown and dark purple linear swatches
- Seed: `kW1Gw93ri-FA5vY5Lr6oRc6Y`
- Page: https://grabient.com/kW1Gw93ri-FA5vY5Lr6oRc6Y?style=linearSwatches&steps=5&angle=180
- Drawn as: linear swatches, 5 steps, 180 degrees
- Kinds: light to dark, vivid, warm
- Hues: analogous
- Contrast of its darkest and lightest colors: 9.5 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 | `#f3c142` | `oklch(83.46% 0.1488 86.48)` | Phellodendron Amurense | black, 12.5 to 1 |
| 2 | `#e99817` | `oklch(74.41% 0.1557 70.63)` | Autumn Yellow | black, 8.9 to 1 |
| 3 | `#d26714` | `oklch(62.99% 0.1585 50.55)` | Hot Cinnamon | black, 5.6 to 1 |
| 4 | `#8d3511` | `oklch(44.88% 0.1281 39.99)` | Rogan Josh | white, 7.9 to 1 |
| 5 | `#3a1526` | `oklch(25.98% 0.0634 353.49)` | Chocolate Kiss | white, 15.9 to 1 |

## CSS

```css
background: linear-gradient(180deg, #f3c142 0.000% 20.000%, #e99817 20.000% 40.000%, #d26714 40.000% 60.000%, #8d3511 60.000% 80.000%, #3a1526 80.000% 100.000%);
background: linear-gradient(180deg, oklch(83.46% 0.1488 86.48) 0.000% 20.000%, oklch(74.41% 0.1557 70.63) 20.000% 40.000%, oklch(62.99% 0.1585 50.55) 40.000% 60.000%, oklch(44.88% 0.1281 39.99) 60.000% 80.000%, oklch(25.98% 0.0634 353.49) 80.000% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.835 | 0.149 | 86.5 |
| 2 | 0.744 | 0.156 | 70.6 |
| 3 | 0.63 | 0.158 | 50.6 |
| 4 | 0.449 | 0.128 | 40 |
| 5 | 0.26 | 0.063 | -6.5 |

## In these collections

- [Jewel tones](https://grabient.com/jewel-tones)

## Other forms

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