# Gray, dark green and brown linear swatches

Gray, dark green and brown linear swatches with 7 colors: #bec99c, #374f3f, #0f2d23, #3f6548, #887b49, #6e6a3f, #16382e. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kWzy1UoAxFzuXPdLGTfJ4_Ko`
- Page: https://grabient.com/kWzy1UoAxFzuXPdLGTfJ4_Ko?style=linearSwatches&angle=160
- Drawn as: linear swatches, 7 steps, 160 degrees
- Hues: wide
- Contrast of its darkest and lightest colors: 8.4 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 | `#bec99c` | `oklch(81.50% 0.0620 118.83)` | Sprout | black, 11.9 to 1 |
| 2 | `#374f3f` | `oklch(40.27% 0.0394 155.11)` | Angry Gremlin | white, 8.9 to 1 |
| 3 | `#0f2d23` | `oklch(26.99% 0.0397 169.40)` | Guerrilla Forest | white, 14.8 to 1 |
| 4 | `#3f6548` | `oklch(46.85% 0.0634 150.53)` | Firm Green | white, 6.6 to 1 |
| 5 | `#887b49` | `oklch(58.31% 0.0703 94.80)` | Willow | black, 4.9 to 1 |
| 6 | `#6e6a3f` | `oklch(51.68% 0.0615 103.68)` | Robinhood | white, 5.5 to 1 |
| 7 | `#16382e` | `oklch(31.10% 0.0427 172.72)` | Medium Jungle Green | white, 12.8 to 1 |

## CSS

```css
background: linear-gradient(160deg, #bec99c 0.000% 14.286%, #374f3f 14.286% 28.571%, #0f2d23 28.571% 42.857%, #3f6548 42.857% 57.143%, #887b49 57.143% 71.429%, #6e6a3f 71.429% 85.714%, #16382e 85.714% 100.000%);
background: linear-gradient(160deg, oklch(81.50% 0.0620 118.83) 0.000% 14.286%, oklch(40.27% 0.0394 155.11) 14.286% 28.571%, oklch(26.99% 0.0397 169.40) 28.571% 42.857%, oklch(46.85% 0.0634 150.53) 42.857% 57.143%, oklch(58.31% 0.0703 94.80) 57.143% 71.429%, oklch(51.68% 0.0615 103.68) 71.429% 85.714%, oklch(31.10% 0.0427 172.72) 85.714% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.815 | 0.062 | 118.8 |
| 2 | 0.252 | 0.033 | 168.5 |
| 3 | 0.469 | 0.063 | 150.5 |
| 4 | 0.591 | 0.069 | 81.8 |
| 5 | 0.311 | 0.043 | 172.7 |

## In these collections

- [Forest swatches](https://grabient.com/forest-swatches)

## Other forms

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