# Emerald and mustard green palette

The Emerald and mustard green palette brings together green and yellow. The colors span a narrow lightness range, combining strong color with gentle contrast. Its light and open character suits brand mood boards and editorial graphics. Its lightest and darkest tones both fall within the green color family.

- Also called: Neon green, lime green and olive angular swatches
- Seed: `kWs5tlZ9i_mzVv3nQz726Y-Q`
- Page: https://grabient.com/kWs5tlZ9i_mzVv3nQz726Y-Q?style=angularSwatches&steps=6&angle=270
- Drawn as: angular swatches, 6 steps, 270 degrees
- Kinds: vivid, neon, light
- Hues: analogous
- 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 | `#38bf2e` | `oklch(70.47% 0.2136 142.03)` | Whole Nine Yards | black, 8.6 to 1 |
| 2 | `#57de28` | `oklch(79.57% 0.2398 139.61)` | Green Apple | black, 11.9 to 1 |
| 3 | `#77ef27` | `oklch(84.79% 0.2439 136.68)` | Slimy Green | black, 14.1 to 1 |
| 4 | `#94e82e` | `oklch(84.52% 0.2197 131.81)` | Quithayran Green | black, 13.8 to 1 |
| 5 | `#a7cd41` | `oklch(79.45% 0.1692 123.55)` | Tender Shoot | black, 11.4 to 1 |
| 6 | `#a6ac5b` | `oklch(72.05% 0.1047 112.44)` | Spinach Banana Smoothie | black, 8.6 to 1 |

## CSS

```css
background: conic-gradient(from 270deg, #38bf2e 0.000% 16.667%, #57de28 16.667% 33.333%, #77ef27 33.333% 50.000%, #94e82e 50.000% 66.667%, #a7cd41 66.667% 83.333%, #a6ac5b 83.333% 100.000%);
background: conic-gradient(from 270deg, oklch(70.47% 0.2136 142.03) 0.000% 16.667%, oklch(79.57% 0.2398 139.61) 16.667% 33.333%, oklch(84.79% 0.2439 136.68) 33.333% 50.000%, oklch(84.52% 0.2197 131.81) 50.000% 66.667%, oklch(79.45% 0.1692 123.55) 66.667% 83.333%, oklch(72.05% 0.1047 112.44) 83.333% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.705 | 0.214 | 142 |
| 2 | 0.815 | 0.244 | 138.9 |
| 3 | 0.854 | 0.236 | 134.6 |
| 4 | 0.811 | 0.185 | 126.2 |
| 5 | 0.72 | 0.105 | 112.4 |

## In these collections

- [Green swatches](https://grabient.com/green-swatches)

## Other forms

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