# Tan and wine color palette

The Tan and wine color palette brings together dark gray, orange, gold, pale orange, and magenta. The colors span a broad lightness range, combining strong color with clear contrast. Its bold and dramatic character suits brand mood boards and editorial graphics. Its darkest tone is dark gray, and its lightest tone is pale orange.

- Also called: Black, yellow, beige and purple linear swatches
- Seed: `kWRgoh1D6_m06xVxjT4MSk1w`
- Page: https://grabient.com/kWRgoh1D6_m06xVxjT4MSk1w?style=linearSwatches&steps=5&angle=45
- Drawn as: linear swatches, 5 steps, 45 degrees
- Kinds: light center, vivid, warm, multicolor
- Hues: wide
- Contrast of its darkest and lightest colors: 10.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 | `#2e2622` | `oklch(27.56% 0.0138 47.11)` | Wood Bark | white, 14.8 to 1 |
| 2 | `#e56828` | `oklch(66.14% 0.1722 43.94)` | Iron Orange | black, 6.3 to 1 |
| 3 | `#faca36` | `oklch(85.83% 0.1612 89.38)` | Banana Boat | black, 13.5 to 1 |
| 4 | `#ebd9c3` | `oklch(89.37% 0.0358 73.53)` | Antique Parchment | black, 15.2 to 1 |
| 5 | `#6d254e` | `oklch(38.58% 0.1130 347.93)` | Ebizome Purple | white, 10.3 to 1 |

## CSS

```css
background: linear-gradient(45deg, #2e2622 0.000% 20.000%, #e56828 20.000% 40.000%, #faca36 40.000% 60.000%, #ebd9c3 60.000% 80.000%, #6d254e 80.000% 100.000%);
background: linear-gradient(45deg, oklch(27.56% 0.0138 47.11) 0.000% 20.000%, oklch(66.14% 0.1722 43.94) 20.000% 40.000%, oklch(85.83% 0.1612 89.38) 40.000% 60.000%, oklch(89.37% 0.0358 73.53) 60.000% 80.000%, oklch(38.58% 0.1130 347.93) 80.000% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.276 | 0.014 | 47.1 |
| 2 | 0.661 | 0.172 | 43.9 |
| 3 | 0.858 | 0.161 | 89.4 |
| 4 | 0.894 | 0.036 | 73.5 |
| 5 | 0.386 | 0.113 | -12.1 |

## In these collections

- [Day of the Dead swatches](https://grabient.com/day-of-the-dead-swatches)
- [Secondary color swatches](https://grabient.com/secondary-color-swatches)

## Other forms

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