# Gray to brown angular gradient

Gray to brown angular gradient with 32 colors: #b9a796, #b4a695, #aea594, #a6a293, #9f9f92, #999c91, #93998f, #8c968c, #85928a, #7d8f88, #778b86, #718784, #6a8382, #647f7f, #5f7b7c, #5a7778, #567275, #546e70, #52696b, #516566, #4f6063, #4e5c61, #50575e, #525259, #524f53, #514c4f, #52494b, #564746, #5c4341, #63403c, #693c37, #6c3a33. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kavBcvVwZGk4JRzEjEIu4dBjUEUW0GsLA`
- Page: https://grabient.com/kavBcvVwZGk4JRzEjEIu4dBjUEUW0GsLA?style=angularGradient&steps=32&angle=210
- Drawn as: angular gradient, 32 steps, 210 degrees
- Kinds: light to dark, neutral
- Hues: monochromatic
- Contrast of its darkest and lightest colors: 3.9 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 | `#b9a796` | `oklch(74.02% 0.0317 66.09)` | Smoky Beige | black, 9 to 1 |
| 2 | `#b4a695` | `oklch(73.32% 0.0294 73.33)` | Sediment | black, 8.8 to 1 |
| 3 | `#aea594` | `oklch(72.36% 0.0259 83.46)` | Smoked Tan | black, 8.5 to 1 |
| 4 | `#a6a293` | `oklch(71.21% 0.0220 95.38)` | Sea Hazel | black, 8.2 to 1 |
| 5 | `#9f9f92` | `oklch(69.96% 0.0187 107.99)` | Dawn | black, 7.8 to 1 |
| 6 | `#999c91` | `oklch(68.71% 0.0167 120.19)` | Acacia Haze | black, 7.5 to 1 |
| 7 | `#93998f` | `oklch(67.45% 0.0165 132.15)` | Pond Leaves | black, 7.1 to 1 |
| 8 | `#8c968c` | `oklch(66.12% 0.0177 145.18)` | Renegade | black, 6.8 to 1 |
| 9 | `#85928a` | `oklch(64.73% 0.0198 158.29)` | Sandstone Grey Green | black, 6.4 to 1 |
| 10 | `#7d8f88` | `oklch(63.31% 0.0221 170.45)` | Lily Pad Pond | black, 6.1 to 1 |
| 11 | `#778b86` | `oklch(61.89% 0.0242 180.62)` | Chinois Green | black, 5.8 to 1 |
| 12 | `#718784` | `oklch(60.47% 0.0260 187.95)` | Deep Thoughts | black, 5.4 to 1 |
| 13 | `#6a8382` | `oklch(59.02% 0.0282 192.84)` | Rock Creek | black, 5.1 to 1 |
| 14 | `#647f7f` | `oklch(57.55% 0.0305 196.11)` | Teal Stencil | black, 4.8 to 1 |
| 15 | `#5f7b7c` | `oklch(56.09% 0.0323 198.54)` | Eye Grey | black, 4.6 to 1 |
| 16 | `#5a7778` | `oklch(54.65% 0.0331 200.96)` | Becker Blue | white, 4.8 to 1 |
| 17 | `#567275` | `oklch(53.23% 0.0326 203.39)` | Juniper Berries | white, 5.1 to 1 |
| 18 | `#546e70` | `oklch(51.79% 0.0305 202.78)` | Micropolis | white, 5.4 to 1 |
| 19 | `#52696b` | `oklch(50.36% 0.0275 201.29)` | Iron Creek | white, 5.8 to 1 |
| 20 | `#516566` | `oklch(48.98% 0.0241 201.97)` | Angry Ocean | white, 6.1 to 1 |
| 21 | `#4f6063` | `oklch(47.67% 0.0210 207.85)` | Limousine Grey Blue | white, 6.5 to 1 |
| 22 | `#4e5c61` | `oklch(46.46% 0.0185 222.15)` | Novelty Navy | white, 6.9 to 1 |
| 23 | `#50575e` | `oklch(45.28% 0.0150 247.85)` | Bovine | white, 7.3 to 1 |
| 24 | `#525259` | `oklch(44.16% 0.0113 280.77)` | Forged Iron | white, 7.7 to 1 |
| 25 | `#524f53` | `oklch(43.15% 0.0085 315.28)` | Magnet | white, 8 to 1 |
| 26 | `#514c4f` | `oklch(42.29% 0.0083 345.79)` | Noblesse | white, 8.3 to 1 |
| 27 | `#52494b` | `oklch(41.64% 0.0120 6.76)` | Emperor | white, 8.6 to 1 |
| 28 | `#564746` | `oklch(41.25% 0.0215 18.43)` | Chinotto | white, 8.8 to 1 |
| 29 | `#5c4341` | `oklch(41.06% 0.0352 24.27)` | Chicory Root | white, 8.9 to 1 |
| 30 | `#63403c` | `oklch(40.99% 0.0503 26.44)` | American Milking Devon | white, 9 to 1 |
| 31 | `#693c37` | `oklch(40.98% 0.0639 27.10)` | Burnished Bark | white, 9.1 to 1 |
| 32 | `#6c3a33` | `oklch(40.94% 0.0730 28.40)` | Iron Flint | white, 9.1 to 1 |

## CSS

```css
background: conic-gradient(from 210deg, #b9a796 0.0%, #b4a695 3.2%, #aea594 6.5%, #a6a293 9.7%, #9f9f92 12.9%, #999c91 16.1%, #93998f 19.4%, #8c968c 22.6%, #85928a 25.8%, #7d8f88 29.0%, #778b86 32.3%, #718784 35.5%, #6a8382 38.7%, #647f7f 41.9%, #5f7b7c 45.2%, #5a7778 48.4%, #567275 51.6%, #546e70 54.8%, #52696b 58.1%, #516566 61.3%, #4f6063 64.5%, #4e5c61 67.7%, #50575e 71.0%, #525259 74.2%, #524f53 77.4%, #514c4f 80.6%, #52494b 83.9%, #564746 87.1%, #5c4341 90.3%, #63403c 93.5%, #693c37 96.8%, #6c3a33 100.0%);
background: conic-gradient(from 210deg in oklch, oklch(74.02% 0.0317 66.09) 0.0%, oklch(73.32% 0.0294 73.33) 3.2%, oklch(72.36% 0.0259 83.46) 6.5%, oklch(71.21% 0.0220 95.38) 9.7%, oklch(69.96% 0.0187 107.99) 12.9%, oklch(68.71% 0.0167 120.19) 16.1%, oklch(67.45% 0.0165 132.15) 19.4%, oklch(66.12% 0.0177 145.18) 22.6%, oklch(64.73% 0.0198 158.29) 25.8%, oklch(63.31% 0.0221 170.45) 29.0%, oklch(61.89% 0.0242 180.62) 32.3%, oklch(60.47% 0.0260 187.95) 35.5%, oklch(59.02% 0.0282 192.84) 38.7%, oklch(57.55% 0.0305 196.11) 41.9%, oklch(56.09% 0.0323 198.54) 45.2%, oklch(54.65% 0.0331 200.96) 48.4%, oklch(53.23% 0.0326 203.39) 51.6%, oklch(51.79% 0.0305 202.78) 54.8%, oklch(50.36% 0.0275 201.29) 58.1%, oklch(48.98% 0.0241 201.97) 61.3%, oklch(47.67% 0.0210 207.85) 64.5%, oklch(46.46% 0.0185 222.15) 67.7%, oklch(45.28% 0.0150 247.85) 71.0%, oklch(44.16% 0.0113 280.77) 74.2%, oklch(43.15% 0.0085 315.28) 77.4%, oklch(42.29% 0.0083 345.79) 80.6%, oklch(41.64% 0.0120 6.76) 83.9%, oklch(41.25% 0.0215 18.43) 87.1%, oklch(41.06% 0.0352 24.27) 90.3%, oklch(40.99% 0.0503 26.44) 93.5%, oklch(40.98% 0.0639 27.10) 96.8%, oklch(40.94% 0.0730 28.40) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.74 | 0.032 | 66.1 |
| 2 | 0.685 | 0.017 | 122.1 |
| 3 | 0.614 | 0.025 | 183.4 |
| 4 | 0.539 | 0.033 | 202.4 |
| 5 | 0.469 | 0.019 | 216.2 |
| 6 | 0.417 | 0.011 | 364.1 |
| 7 | 0.409 | 0.073 | 388.4 |

## In these collections

- [Muted rainbow gradients](https://grabient.com/muted-rainbow-gradients)

## Other forms

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