# Terracotta, indigo and sage tetradic palette

The Terracotta, indigo and sage tetradic palette brings together orange, purple, blue, magenta, red, and green. The colors span a narrow lightness range, combining moderate color with gentle contrast. Its balanced and composed character suits brand mood boards and editorial graphics. Its darkest tone is blue, and its lightest tone is orange.

- Also called: Tan, blue, purple and green linear swatches
- Seed: `kYt1YxTQyyMUkunII0fT5RF9qfTG`
- Page: https://grabient.com/kYt1YxTQyyMUkunII0fT5RF9qfTG?style=linearSwatches&steps=6&angle=315
- Drawn as: linear swatches, 6 steps, 315 degrees
- Kinds: muted
- Hues: wide
- Contrast of its darkest and lightest colors: 2 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 | `#d5964b` | `oklch(72.05% 0.1185 68.91)` | Georgian Yellow | black, 8.2 to 1 |
| 2 | `#897c91` | `oklch(60.63% 0.0344 312.66)` | Dusky Grape | black, 5.3 to 1 |
| 3 | `#546daa` | `oklch(54.33% 0.1006 266.17)` | New Age Blue | white, 5 to 1 |
| 4 | `#98608f` | `oklch(56.69% 0.0965 332.74)` | Kyo Purple | white, 4.7 to 1 |
| 5 | `#a77b78` | `oklch(62.60% 0.0551 23.47)` | Cherry Mocha | black, 5.7 to 1 |
| 6 | `#92ad74` | `oklch(71.26% 0.0854 129.14)` | Geranium Leaf | black, 8.4 to 1 |

## CSS

```css
background: linear-gradient(315deg, #d5964b 0.000% 16.667%, #897c91 16.667% 33.333%, #546daa 33.333% 50.000%, #98608f 50.000% 66.667%, #a77b78 66.667% 83.333%, #92ad74 83.333% 100.000%);
background: linear-gradient(315deg, oklch(72.05% 0.1185 68.91) 0.000% 16.667%, oklch(60.63% 0.0344 312.66) 16.667% 33.333%, oklch(54.33% 0.1006 266.17) 33.333% 50.000%, oklch(56.69% 0.0965 332.74) 50.000% 66.667%, oklch(62.60% 0.0551 23.47) 66.667% 83.333%, oklch(71.26% 0.0854 129.14) 83.333% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.72 | 0.119 | 68.9 |
| 2 | 0.606 | 0.034 | -47.3 |
| 3 | 0.543 | 0.101 | -93.8 |
| 4 | 0.567 | 0.096 | -27.3 |
| 5 | 0.626 | 0.055 | 23.5 |
| 6 | 0.713 | 0.085 | 129.1 |

## In these collections

- [Tetradic color palette](https://grabient.com/tetradic-color-palette)

## Other forms

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