# Purple, beige, gray and brown linear gradient

Purple, beige, gray and brown linear gradient with 7 colors: #635272, #bc8f90, #e5d0ae, #a79780, #66574b, #756351, #917f62. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kUdyjb7hLPjuKPZNEUIg`
- Page: https://grabient.com/kUdyjb7hLPjuKPZNEUIg
- Drawn as: linear gradient, 7 steps, 90 degrees
- Kinds: muted, warm
- Hues: wide
- Contrast of its darkest and lightest colors: 4.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 | `#635272` | `oklch(46.85% 0.0551 308.67)` | Blackberry Farm | white, 7 to 1 |
| 2 | `#bc8f90` | `oklch(69.22% 0.0545 15.97)` | Rosy Brown | black, 7.4 to 1 |
| 3 | `#e5d0ae` | `oklch(86.61% 0.0510 80.77)` | Chaparral | black, 13.9 to 1 |
| 4 | `#a79780` | `oklch(68.36% 0.0378 77.79)` | Bronco | black, 7.3 to 1 |
| 5 | `#66574b` | `oklch(46.85% 0.0276 60.69)` | Chocolate Swirl | white, 6.9 to 1 |
| 6 | `#756351` | `oklch(51.25% 0.0357 68.94)` | Tanbark Trail | white, 5.7 to 1 |
| 7 | `#917f62` | `oklch(60.63% 0.0469 79.71)` | Woolly Thyme | black, 5.4 to 1 |

## CSS

```css
background: linear-gradient(90deg, #635272 0.0%, #bc8f90 16.7%, #e5d0ae 33.3%, #a79780 50.0%, #66574b 66.7%, #756351 83.3%, #917f62 100.0%);
background: linear-gradient(90deg in oklch, oklch(46.85% 0.0551 308.67) 0.0%, oklch(69.22% 0.0545 15.97) 16.7%, oklch(86.61% 0.0510 80.77) 33.3%, oklch(68.36% 0.0378 77.79) 50.0%, oklch(46.85% 0.0276 60.69) 66.7%, oklch(51.25% 0.0357 68.94) 83.3%, oklch(60.63% 0.0469 79.71) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.469 | 0.055 | 308.7 |
| 2 | 0.866 | 0.051 | 440.8 |
| 3 | 0.469 | 0.028 | 420.7 |
| 4 | 0.606 | 0.047 | 439.7 |

## Other forms

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