# Beige, gray, brown and orange linear gradient

Beige, gray, brown and orange linear gradient with 7 colors: #dcd5ae, #b6c0a0, #6d927c, #3f6251, #584e2c, #a2621e, #d68f28. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `ka3SZG5JDCs-TRC7EkBthM3sapvFZssDg`
- Page: https://grabient.com/ka3SZG5JDCs-TRC7EkBthM3sapvFZssDg
- Drawn as: linear gradient, 7 steps, 90 degrees
- Kinds: dark center
- Hues: wide
- Contrast of its darkest and lightest colors: 5.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 | `#dcd5ae` | `oklch(87.01% 0.0524 99.14)` | Morning Moor | black, 14.2 to 1 |
| 2 | `#b6c0a0` | `oklch(79.13% 0.0455 122.39)` | Chopped Dill | black, 11 to 1 |
| 3 | `#6d927c` | `oklch(62.60% 0.0524 158.32)` | Cool Bluegrass | black, 6 to 1 |
| 4 | `#3f6251` | `oklch(46.46% 0.0496 162.55)` | Tropical Foliage | white, 6.8 to 1 |
| 5 | `#584e2c` | `oklch(42.52% 0.0524 92.80)` | Thatch Green | white, 8.2 to 1 |
| 6 | `#a2621e` | `oklch(55.51% 0.1144 62.15)` | Cockatrice Brown | white, 4.9 to 1 |
| 7 | `#d68f28` | `oklch(70.47% 0.1392 70.61)` | Turmeric Tea | black, 7.7 to 1 |

## CSS

```css
background: linear-gradient(90deg, #dcd5ae 0.0%, #b6c0a0 16.7%, #6d927c 33.3%, #3f6251 50.0%, #584e2c 66.7%, #a2621e 83.3%, #d68f28 100.0%);
background: linear-gradient(90deg in oklch, oklch(87.01% 0.0524 99.14) 0.0%, oklch(79.13% 0.0455 122.39) 16.7%, oklch(62.60% 0.0524 158.32) 33.3%, oklch(46.46% 0.0496 162.55) 50.0%, oklch(42.52% 0.0524 92.80) 66.7%, oklch(55.51% 0.1144 62.15) 83.3%, oklch(70.47% 0.1392 70.61) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.87 | 0.052 | 99.1 |
| 2 | 0.791 | 0.045 | 122.4 |
| 3 | 0.626 | 0.052 | 158.3 |
| 4 | 0.465 | 0.05 | 162.5 |
| 5 | 0.425 | 0.052 | 92.8 |
| 6 | 0.555 | 0.114 | 62.2 |
| 7 | 0.705 | 0.139 | 70.6 |

## In these collections

- [Loden wool and amber](https://grabient.com/loden-wool-and-amber)

## Other forms

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