# Tan, stone and bronze forest palette

The Tan, stone and bronze forest palette brings together orange, green, light green, and dark orange. The colors span a broad lightness range, combining restrained color with clear contrast. Its balanced and composed character suits botanical branding and garden event graphics. Its darkest tone is dark orange, and its lightest tone is light green.

- Also called: Brown, gray and black angular swatches
- Seed: `kUjiovUY_HuuMPifizgA`
- Page: https://grabient.com/kUjiovUY_HuuMPifizgA?style=angularSwatches&steps=4&angle=135
- Drawn as: angular swatches, 4 steps, 135 degrees
- Kinds: light center, neutral
- Hues: analogous
- Contrast of its darkest and lightest colors: 10.2 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 | `#8c6e50` | `oklch(55.91% 0.0579 66.09)` | Cupcake | white, 4.7 to 1 |
| 2 | `#839278` | `oklch(64.17% 0.0427 131.61)` | Catalina Green | black, 6.3 to 1 |
| 3 | `#cbd0b8` | `oklch(84.65% 0.0331 116.82)` | Sweet Surrender | black, 13.2 to 1 |
| 4 | `#2d1d14` | `oklch(24.80% 0.0303 50.24)` | Weathervane | white, 16.2 to 1 |

## CSS

```css
background: conic-gradient(from 135deg, #8c6e50 0.000% 25.000%, #839278 25.000% 50.000%, #cbd0b8 50.000% 75.000%, #2d1d14 75.000% 100.000%);
background: conic-gradient(from 135deg, oklch(55.91% 0.0579 66.09) 0.000% 25.000%, oklch(64.17% 0.0427 131.61) 25.000% 50.000%, oklch(84.65% 0.0331 116.82) 50.000% 75.000%, oklch(24.80% 0.0303 50.24) 75.000% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.559 | 0.058 | 66.1 |
| 2 | 0.642 | 0.043 | 131.6 |
| 3 | 0.846 | 0.033 | 116.8 |
| 4 | 0.248 | 0.03 | 50.2 |

## In these collections

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

## Other forms

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