# Moss and yellow wasabi palette

The Moss and yellow wasabi palette brings together green and light yellow. The colors span a narrow lightness range, combining moderate color with gentle contrast. Its light and open character suits food packaging concepts and menu graphics. Its darkest tone is green, and its lightest tone is light yellow.

- Also called: Pastel analogous green and beige angular swatches
- Seed: `kSu11ZcCA-eKrQQ`
- Page: https://grabient.com/kSu11ZcCA-eKrQQ?style=angularSwatches&steps=5&angle=135
- Drawn as: angular swatches, 5 steps, 135 degrees
- Kinds: pastel, light
- Hues: monochromatic
- Contrast of its darkest and lightest colors: 1.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 | `#97b859` | `oklch(73.62% 0.1281 125.16)` | Happy Tune | black, 9.2 to 1 |
| 2 | `#bccc7c` | `oklch(81.57% 0.1063 118.22)` | Greenish Tan | black, 12.1 to 1 |
| 3 | `#d8df9b` | `oklch(88.19% 0.0882 112.48)` | Young Wheat | black, 14.9 to 1 |
| 4 | `#c6d386` | `oklch(83.78% 0.1008 116.44)` | Zucchini Noodles | black, 13 to 1 |
| 5 | `#a9c269` | `oklch(77.56% 0.1185 121.99)` | Light Olive | black, 10.6 to 1 |

## CSS

```css
background: conic-gradient(from 135deg, #97b859 0.000% 20.000%, #bccc7c 20.000% 40.000%, #d8df9b 40.000% 60.000%, #c6d386 60.000% 80.000%, #a9c269 80.000% 100.000%);
background: conic-gradient(from 135deg, oklch(73.62% 0.1281 125.16) 0.000% 20.000%, oklch(81.57% 0.1063 118.22) 20.000% 40.000%, oklch(88.19% 0.0882 112.48) 40.000% 60.000%, oklch(83.78% 0.1008 116.44) 60.000% 80.000%, oklch(77.56% 0.1185 121.99) 80.000% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.736 | 0.128 | 125.2 |
| 2 | 0.882 | 0.088 | 112.5 |
| 3 | 0.776 | 0.119 | 122 |

## In these collections

- [Wasabi swatches](https://grabient.com/wasabi-swatches)

## Other forms

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