# Moss, stone and terracotta color palette

The Moss, stone and terracotta color palette brings together green, light blue, light gray, and orange. The colors span a moderate lightness range, combining moderate color with gentle contrast. Its balanced and composed character suits travel posters and environmental mood boards. Its darkest tone is orange, and its lightest tone is light gray.

- Also called: Green, light blue, gray and brown angular swatches
- Seed: `kUt0xZXJPLmoGM3FHTdg`
- Page: https://grabient.com/kUt0xZXJPLmoGM3FHTdg?style=angularSwatches&steps=4&angle=225
- Drawn as: angular swatches, 4 steps, 225 degrees
- Kinds: pastel
- Hues: two-hue
- Contrast of its darkest and lightest colors: 3.1 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 | `#95b066` | `oklch(72.05% 0.1047 125.16)` | Herbal Garden | black, 8.7 to 1 |
| 2 | `#82afc0` | `oklch(72.83% 0.0537 223.43)` | Open Seas | black, 8.8 to 1 |
| 3 | `#c8cabf` | `oklch(83.46% 0.0165 117.76)` | Create | black, 12.6 to 1 |
| 4 | `#966047` | `oklch(54.33% 0.0799 45.90)` | Cinnamon Spice | white, 5.1 to 1 |

## CSS

```css
background: conic-gradient(from 225deg, #95b066 0.000% 25.000%, #82afc0 25.000% 50.000%, #c8cabf 50.000% 75.000%, #966047 75.000% 100.000%);
background: conic-gradient(from 225deg, oklch(72.05% 0.1047 125.16) 0.000% 25.000%, oklch(72.83% 0.0537 223.43) 25.000% 50.000%, oklch(83.46% 0.0165 117.76) 50.000% 75.000%, oklch(54.33% 0.0799 45.90) 75.000% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.72 | 0.105 | 125.2 |
| 2 | 0.728 | 0.054 | 223.4 |
| 3 | 0.835 | 0.017 | 117.8 |
| 4 | 0.543 | 0.08 | 45.9 |

## In these collections

- [Fynbos after winter rain](https://grabient.com/fynbos-after-winter-rain)
- [Dusty swatches](https://grabient.com/dusty-swatches)

## Other forms

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