# Soft Grass Green Leaf Green Sunlit Gold

These concentric swatch rings move through soft grass green, leaf green, sunlit gold, rain green, and warm amber in its saved order. The complete composition keeps the lighter and darker areas distinct while preserving a balanced route through the named palette.

- Also called: Beige, yellow, teal and tan radial swatches
- Seed: `kWzT5WU57C-6uOY-FUj3am0I`
- Page: https://grabient.com/kWzT5WU57C-6uOY-FUj3am0I?style=radialSwatches&steps=5&angle=0
- Drawn as: radial swatches, 5 steps, 0 degrees
- Hues: analogous
- Contrast of its darkest and lightest colors: 4.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 | `#b8c98a` | `oklch(80.71% 0.0854 120.94)` | Marsh Fern | black, 11.7 to 1 |
| 2 | `#6fa073` | `oklch(65.75% 0.0841 146.30)` | Growth | black, 6.9 to 1 |
| 3 | `#f2d26c` | `oklch(87.01% 0.1268 92.41)` | Yellow Cream | black, 14.1 to 1 |
| 4 | `#3d6b5a` | `oklch(48.82% 0.0579 168.49)` | June Ivy | white, 6.1 to 1 |
| 5 | `#d89c54` | `oklch(73.62% 0.1144 69.16)` | Ceremonial Gold | black, 8.8 to 1 |

## CSS

```css
background: radial-gradient(circle at 50% 50%, #b8c98a 0.000% 20.000%, #6fa073 20.000% 40.000%, #f2d26c 40.000% 60.000%, #3d6b5a 60.000% 80.000%, #d89c54 80.000% 100.000%);
background: radial-gradient(circle at 50% 50%, oklch(80.71% 0.0854 120.94) 0.000% 20.000%, oklch(65.75% 0.0841 146.30) 20.000% 40.000%, oklch(87.01% 0.1268 92.41) 40.000% 60.000%, oklch(48.82% 0.0579 168.49) 60.000% 80.000%, oklch(73.62% 0.1144 69.16) 80.000% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.807 | 0.085 | 120.9 |
| 2 | 0.657 | 0.084 | 146.3 |
| 3 | 0.87 | 0.127 | 92.4 |
| 4 | 0.488 | 0.058 | 168.5 |
| 5 | 0.736 | 0.114 | 69.2 |

## In these collections

- [Spring thunder over veld](https://grabient.com/spring-thunder-over-veld)

## Other forms

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