# Magenta, terracotta and sage triadic palette

The Magenta, terracotta and sage triadic palette brings together purple, magenta, orange, green, and teal. The colors span a moderate lightness range, combining moderate color with gentle contrast. Its balanced and composed character suits brand mood boards and editorial graphics. Its darkest tone is purple, and its lightest tone is orange.

- Also called: Purple, brown and teal linear swatches
- Seed: `kYeWLizqjB9KrypjKMFRxjLlkUQK`
- Page: https://grabient.com/kYeWLizqjB9KrypjKMFRxjLlkUQK?style=linearSwatches&steps=6&angle=45
- Drawn as: linear swatches, 6 steps, 45 degrees
- Hues: triadic
- Contrast of its darkest and lightest colors: 3.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 | `#7c3f8c` | `oklch(47.64% 0.1350 318.52)` | Nightly Violet | white, 7.1 to 1 |
| 2 | `#af6aa0` | `oklch(61.81% 0.1116 335.42)` | Victorian Valentine | black, 5.4 to 1 |
| 3 | `#c07e35` | `oklch(64.96% 0.1199 65.25)` | Autumn Fest | black, 6.3 to 1 |
| 4 | `#dfae60` | `oklch(77.95% 0.1116 76.87)` | Cameleer | black, 10.3 to 1 |
| 5 | `#468172` | `oklch(55.91% 0.0675 175.15)` | Aussie Surf | black, 4.6 to 1 |
| 6 | `#78aaa1` | `oklch(70.08% 0.0551 181.49)` | Scenario | black, 8 to 1 |

## CSS

```css
background: linear-gradient(45deg, #7c3f8c 0.000% 16.667%, #af6aa0 16.667% 33.333%, #c07e35 33.333% 50.000%, #dfae60 50.000% 66.667%, #468172 66.667% 83.333%, #78aaa1 83.333% 100.000%);
background: linear-gradient(45deg, oklch(47.64% 0.1350 318.52) 0.000% 16.667%, oklch(61.81% 0.1116 335.42) 16.667% 33.333%, oklch(64.96% 0.1199 65.25) 33.333% 50.000%, oklch(77.95% 0.1116 76.87) 50.000% 66.667%, oklch(55.91% 0.0675 175.15) 66.667% 83.333%, oklch(70.08% 0.0551 181.49) 83.333% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.476 | 0.135 | 318.5 |
| 2 | 0.618 | 0.112 | 335.4 |
| 3 | 0.65 | 0.12 | 425.2 |
| 4 | 0.78 | 0.112 | 436.9 |
| 5 | 0.559 | 0.068 | 535.1 |
| 6 | 0.701 | 0.055 | 541.5 |

## In these collections

- [Triadic swatches](https://grabient.com/triadic-swatches)

## Other forms

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