# Cider Gold beside Teal

Tritone tan, brown and teal linear swatches with 4 colors: #b9b981, #d5b576, #9b6442, #467779. Edit it and copy or download CSS, SVG, PNG or shader code.

- Also called: Tritone tan, brown and teal linear swatches
- Seed: `kUxDZNZCC9EafvBEE9FA`
- Page: https://grabient.com/kUxDZNZCC9EafvBEE9FA?style=linearSwatches&steps=4
- Drawn as: linear swatches, 4 steps, 90 degrees
- Kinds: warm
- Hues: analogous
- Contrast of its darkest and lightest colors: 2.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 | `#b9b981` | `oklch(77.17% 0.0744 108.28)` | Grass Cloth | black, 10.3 to 1 |
| 2 | `#d5b576` | `oklch(78.74% 0.0896 83.98)` | Egyptian Temple | black, 10.7 to 1 |
| 3 | `#9b6442` | `oklch(55.51% 0.0868 51.22)` | Mocha Bisque | white, 4.8 to 1 |
| 4 | `#467779` | `oklch(53.54% 0.0537 198.11)` | Cool Waters | white, 5 to 1 |

## CSS

```css
background: linear-gradient(90deg, #b9b981 0.000% 25.000%, #d5b576 25.000% 50.000%, #9b6442 50.000% 75.000%, #467779 75.000% 100.000%);
background: linear-gradient(90deg, oklch(77.17% 0.0744 108.28) 0.000% 25.000%, oklch(78.74% 0.0896 83.98) 25.000% 50.000%, oklch(55.51% 0.0868 51.22) 50.000% 75.000%, oklch(53.54% 0.0537 198.11) 75.000% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.772 | 0.074 | 108.3 |
| 2 | 0.787 | 0.09 | 84 |
| 3 | 0.555 | 0.087 | 51.2 |
| 4 | 0.535 | 0.054 | 198.1 |

## In these collections

- [Cider press afternoon](https://grabient.com/cider-press-afternoon)
- [Between tides](https://grabient.com/between-tides)

## Other forms

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