# Dark green, dark gray and maroon linear swatches

Dark green, dark gray and maroon linear swatches with 6 colors: #1e4335, #404040, #636e4e, #817453, #8d4a4b, #8a3b38. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kYWSR2LwA8kISPjHkrwPqE3ronwG`
- Page: https://grabient.com/kYWSR2LwA8kISPjHkrwPqE3ronwG?style=linearSwatches&steps=6&angle=45
- Drawn as: linear swatches, 6 steps, 45 degrees
- Kinds: muted
- Hues: wide
- Contrast of its darkest and lightest colors: 2.3 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 | `#1e4335` | `oklch(35.04% 0.0496 165.94)` | Everglade | white, 11 to 1 |
| 2 | `#404040` | `oklch(37.01% 0.0000 89.88)` | Bauhaus | white, 10.4 to 1 |
| 3 | `#636e4e` | `oklch(51.97% 0.0496 122.61)` | Hinterland | white, 5.4 to 1 |
| 4 | `#817453` | `oklch(56.30% 0.0510 89.85)` | Pesto Green | white, 4.5 to 1 |
| 5 | `#8d4a4b` | `oklch(49.21% 0.0909 20.11)` | Rhubarb Smoothie | white, 6.5 to 1 |
| 6 | `#8a3b38` | `oklch(45.67% 0.1089 24.33)` | Red Blooded | white, 7.6 to 1 |

## CSS

```css
background: linear-gradient(45deg, #1e4335 0.000% 16.667%, #404040 16.667% 33.333%, #636e4e 33.333% 50.000%, #817453 50.000% 66.667%, #8d4a4b 66.667% 83.333%, #8a3b38 83.333% 100.000%);
background: linear-gradient(45deg, oklch(35.04% 0.0496 165.94) 0.000% 16.667%, oklch(37.01% 0.0000 89.88) 16.667% 33.333%, oklch(51.97% 0.0496 122.61) 33.333% 50.000%, oklch(56.30% 0.0510 89.85) 50.000% 66.667%, oklch(49.21% 0.0909 20.11) 66.667% 83.333%, oklch(45.67% 0.1089 24.33) 83.333% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.35 | 0.05 | 165.9 |
| 2 | 0.37 | 0 | 137.4 |
| 3 | 0.52 | 0.05 | 122.6 |
| 4 | 0.563 | 0.051 | 89.9 |
| 5 | 0.492 | 0.091 | 20.1 |
| 6 | 0.457 | 0.109 | 24.3 |

## Other forms

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