# Gray to brown linear gradient

Gray to brown linear gradient with 7 colors: #718992, #7e7c6e, #926851, #9d563f, #965432, #815f31, #6c743e. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kYnBaeyYkvMUeu3Cpr_QJzC0ScRc`
- Page: https://grabient.com/kYnBaeyYkvMUeu3Cpr_QJzC0ScRc
- Drawn as: linear gradient, 7 steps, 90 degrees
- Kinds: even lightness, warm
- Hues: analogous
- Contrast of its darkest and lightest colors: 1.5 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 | `#718992` | `oklch(61.42% 0.0303 222.89)` | Lyric Blue | black, 5.6 to 1 |
| 2 | `#7e7c6e` | `oklch(58.51% 0.0220 100.53)` | Vetiver | black, 5 to 1 |
| 3 | `#926851` | `oklch(55.40% 0.0647 49.35)` | Leather | white, 4.8 to 1 |
| 4 | `#9d563f` | `oklch(53.22% 0.1005 38.82)` | Ancient Copper | white, 5.4 to 1 |
| 5 | `#965432` | `oklch(51.63% 0.0996 47.47)` | Chelsea Gem | white, 5.8 to 1 |
| 6 | `#815f31` | `oklch(51.08% 0.0768 73.88)` | Bronze Brown | white, 5.8 to 1 |
| 7 | `#6c743e` | `oklch(53.94% 0.0772 116.16)` | Cedar Green | white, 4.9 to 1 |

## CSS

```css
background: linear-gradient(90deg, #718992 0.0%, #7e7c6e 16.7%, #926851 33.3%, #9d563f 50.0%, #965432 66.7%, #815f31 83.3%, #6c743e 100.0%);
background: linear-gradient(90deg in oklch, oklch(61.42% 0.0303 222.89) 0.0%, oklch(58.51% 0.0220 100.53) 16.7%, oklch(55.40% 0.0647 49.35) 33.3%, oklch(53.22% 0.1005 38.82) 50.0%, oklch(51.63% 0.0996 47.47) 66.7%, oklch(51.08% 0.0768 73.88) 83.3%, oklch(53.94% 0.0772 116.16) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.614 | 0.03 | 222.9 |
| 2 | 0.579 | 0.025 | 81.3 |
| 3 | 0.543 | 0.084 | 43.2 |
| 4 | 0.524 | 0.106 | 42.2 |
| 5 | 0.508 | 0.079 | 66.5 |
| 6 | 0.539 | 0.077 | 116.2 |

## In these collections

- [Burnished beech canopy](https://grabient.com/burnished-beech-canopy)

## Other forms

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