# Rose, terracotta and moss complementary palette

The Rose, terracotta and moss complementary palette brings together magenta, red, yellow, and green. The colors span a narrow lightness range, combining strong color with gentle contrast. Its balanced and composed character suits brand mood boards and editorial graphics. Its darkest tone is magenta, and its lightest tone is yellow.

- Also called: Purple, pink, tan and olive angular swatches
- Seed: `kYg3r4SUDAFEoQXdJkwWbhBs4qwC`
- Page: https://grabient.com/kYg3r4SUDAFEoQXdJkwWbhBs4qwC?style=angularSwatches&steps=6&angle=135
- Drawn as: angular swatches, 6 steps, 135 degrees
- Kinds: vivid, multicolor
- Hues: split-complementary
- Contrast of its darkest and lightest colors: 2.6 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 | `#a83277` | `oklch(51.57% 0.1681 348.75)` | Plum Kingdom | white, 6.1 to 1 |
| 2 | `#c04188` | `oklch(57.48% 0.1778 349.81)` | Orchid Ecstasy | white, 4.8 to 1 |
| 3 | `#c26e86` | `oklch(63.78% 0.1102 2.49)` | Silk Ribbon | black, 5.8 to 1 |
| 4 | `#b2ac5a` | `oklch(73.23% 0.1047 104.99)` | Palm Frond | black, 8.9 to 1 |
| 5 | `#95ad26` | `oklch(70.47% 0.1543 119.79)` | Lime Green | black, 8.2 to 1 |
| 6 | `#798f37` | `oklch(61.42% 0.1171 121.90)` | Fresh Herb | black, 5.8 to 1 |

## CSS

```css
background: conic-gradient(from 135deg, #a83277 0.000% 16.667%, #c04188 16.667% 33.333%, #c26e86 33.333% 50.000%, #b2ac5a 50.000% 66.667%, #95ad26 66.667% 83.333%, #798f37 83.333% 100.000%);
background: conic-gradient(from 135deg, oklch(51.57% 0.1681 348.75) 0.000% 16.667%, oklch(57.48% 0.1778 349.81) 16.667% 33.333%, oklch(63.78% 0.1102 2.49) 33.333% 50.000%, oklch(73.23% 0.1047 104.99) 50.000% 66.667%, oklch(70.47% 0.1543 119.79) 66.667% 83.333%, oklch(61.42% 0.1171 121.90) 83.333% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.516 | 0.168 | 348.8 |
| 2 | 0.575 | 0.178 | 349.8 |
| 3 | 0.638 | 0.11 | 362.5 |
| 4 | 0.732 | 0.105 | 465 |
| 5 | 0.705 | 0.154 | 479.8 |
| 6 | 0.614 | 0.117 | 481.9 |

## In these collections

- [Complementary swatches](https://grabient.com/complementary-swatches)

## Other forms

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