# Gold, terracotta and deep cyan color palette

The Gold, terracotta and deep cyan color palette brings together pale orange, light orange, orange, red, and blue. The colors span a broad lightness range, combining moderate color with clear contrast. Its balanced and composed character suits travel posters and environmental mood boards. Its darkest tone is blue, and its lightest tone is pale orange.

- Also called: Tritone beige, brown and navy linear swatches
- Seed: `kW5SQ9YiS-9ArvG9KD5rJYtA`
- Page: https://grabient.com/kW5SQ9YiS-9ArvG9KD5rJYtA?style=linearSwatches&steps=5
- Drawn as: linear swatches, 5 steps, 90 degrees
- Kinds: light to dark, warm
- Hues: analogous
- Contrast of its darkest and lightest colors: 8.3 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 | `#edddba` | `oklch(90.16% 0.0496 85.78)` | Salt Steppe | black, 15.6 to 1 |
| 2 | `#d9ad68` | `oklch(77.17% 0.1006 77.33)` | Butterscotch Bliss | black, 10 to 1 |
| 3 | `#c37144` | `oklch(62.99% 0.1199 47.74)` | Apricot Mocha | black, 5.7 to 1 |
| 4 | `#914330` | `oklch(48.03% 0.1102 35.06)` | Brick Paver | white, 6.8 to 1 |
| 5 | `#153f56` | `oklch(35.04% 0.0606 235.49)` | Duskwood | white, 11.1 to 1 |

## CSS

```css
background: linear-gradient(90deg, #edddba 0.000% 20.000%, #d9ad68 20.000% 40.000%, #c37144 40.000% 60.000%, #914330 60.000% 80.000%, #153f56 80.000% 100.000%);
background: linear-gradient(90deg, oklch(90.16% 0.0496 85.78) 0.000% 20.000%, oklch(77.17% 0.1006 77.33) 20.000% 40.000%, oklch(62.99% 0.1199 47.74) 40.000% 60.000%, oklch(48.03% 0.1102 35.06) 60.000% 80.000%, oklch(35.04% 0.0606 235.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.902 | 0.05 | 85.8 |
| 2 | 0.772 | 0.101 | 77.3 |
| 3 | 0.63 | 0.12 | 47.7 |
| 4 | 0.48 | 0.11 | 35.1 |
| 5 | 0.35 | 0.061 | -124.5 |

## In these collections

- [Desert swatches](https://grabient.com/desert-swatches)
- [Natural swatches](https://grabient.com/natural-swatches)

## Other forms

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