# Gray, purple and brown linear gradient

Gray, purple and brown linear gradient with 7 colors: #e7dfd1, #a9a29c, #60615e, #2e3133, #4d4052, #7d5755, #8a7256. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kW5g84TQM_SeCUy5kU1yBLJY`
- Page: https://grabient.com/kW5g84TQM_SeCUy5kU1yBLJY
- Drawn as: linear gradient, 7 steps, 90 degrees
- Kinds: dark center, neutral
- Hues: wide
- Contrast of its darkest and lightest colors: 9.8 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 | `#e7dfd1` | `oklch(90.55% 0.0207 78.75)` | Canvas Cloth | black, 15.8 to 1 |
| 2 | `#a9a29c` | `oklch(71.68% 0.0121 62.98)` | Functional Grey | black, 8.3 to 1 |
| 3 | `#60615e` | `oklch(49.14% 0.0050 117.07)` | Hematite | white, 6.2 to 1 |
| 4 | `#2e3133` | `oklch(31.10% 0.0055 236.21)` | Tap Shoe | white, 13 to 1 |
| 5 | `#4d4052` | `oklch(39.14% 0.0342 316.60)` | Stone Violet | white, 9.6 to 1 |
| 6 | `#7d5755` | `oklch(49.71% 0.0511 22.59)` | Berry Brandy | white, 6.2 to 1 |
| 7 | `#8a7256` | `oklch(56.69% 0.0510 70.65)` | China Cinnamon | black, 4.6 to 1 |

## CSS

```css
background: linear-gradient(90deg, #e7dfd1 0.0%, #a9a29c 16.7%, #60615e 33.3%, #2e3133 50.0%, #4d4052 66.7%, #7d5755 83.3%, #8a7256 100.0%);
background: linear-gradient(90deg in oklch, oklch(90.55% 0.0207 78.75) 0.0%, oklch(71.68% 0.0121 62.98) 16.7%, oklch(49.14% 0.0050 117.07) 33.3%, oklch(31.10% 0.0055 236.21) 50.0%, oklch(39.14% 0.0342 316.60) 66.7%, oklch(49.71% 0.0511 22.59) 83.3%, oklch(56.69% 0.0510 70.65) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.906 | 0.021 | 78.8 |
| 2 | 0.606 | 0.008 | 73.5 |
| 3 | 0.311 | 0.006 | 236.2 |
| 4 | 0.453 | 0.047 | 350.3 |
| 5 | 0.567 | 0.051 | 430.6 |

## In these collections

- [Charcoal plum tailoring](https://grabient.com/charcoal-plum-tailoring)
- [Shade swatches](https://grabient.com/shade-swatches)
- [Wilderkind](https://grabient.com/wilderkind)

## Other forms

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