# Monochrome brown and tan angular gradient

Monochrome brown and tan angular gradient with 32 colors: #372d2a, #3d322d, #463831, #504037, #5b483c, #665141, #715946, #7b614a, #86694f, #917253, #9b7a58, #a6845e, #b29065, #bd9d6c, #c6a873, #cdaf77, #ceb078, #ccac75, #c6a46f, #be9a69, #b59062, #ac875d, #a17d57, #957251, #88684b, #7c5e45, #715641, #674e3d, #5e473a, #544038, #4d3b35, #473833. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kaTgseug5Bs4XwTiHcG05s-b0SPotCL1A`
- Page: https://grabient.com/kaTgseug5Bs4XwTiHcG05s-b0SPotCL1A?style=angularGradient&steps=32&angle=315
- Drawn as: angular gradient, 32 steps, 315 degrees
- Kinds: light center, warm, monochrome
- Hues: analogous
- Contrast of its darkest and lightest colors: 6.4 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 | `#372d2a` | `oklch(30.71% 0.0152 42.89)` | Mole | white, 13.3 to 1 |
| 2 | `#3d322d` | `oklch(32.65% 0.0182 44.89)` | Six Feet Under | white, 12.4 to 1 |
| 3 | `#463831` | `oklch(35.38% 0.0224 47.74)` | Americano | white, 11.2 to 1 |
| 4 | `#504037` | `oklch(38.58% 0.0274 51.02)` | Paco | white, 9.8 to 1 |
| 5 | `#5b483c` | `oklch(41.94% 0.0326 54.34)` | Tannery Brown | white, 8.5 to 1 |
| 6 | `#665141` | `oklch(45.17% 0.0378 57.26)` | Revival Mahogany | white, 7.4 to 1 |
| 7 | `#715946` | `oklch(48.16% 0.0428 59.58)` | Log Cabin | white, 6.5 to 1 |
| 8 | `#7b614a` | `oklch(51.20% 0.0481 61.58)` | Aviator | white, 5.7 to 1 |
| 9 | `#86694f` | `oklch(54.26% 0.0534 63.43)` | Pastel Brown | white, 5 to 1 |
| 10 | `#917253` | `oklch(57.33% 0.0586 65.33)` | Sagebrush | black, 4.7 to 1 |
| 11 | `#9b7a58` | `oklch(60.40% 0.0633 67.46)` | Prince Paris | black, 5.3 to 1 |
| 12 | `#a6845e` | `oklch(63.65% 0.0675 70.15)` | Wooden Swing | black, 6 to 1 |
| 13 | `#b29065` | `oklch(67.45% 0.0716 73.68)` | Maple View | black, 7 to 1 |
| 14 | `#bd9d6c` | `oklch(71.30% 0.0754 77.40)` | Curry Sauce | black, 8.1 to 1 |
| 15 | `#c6a873` | `oklch(74.58% 0.0785 80.63)` | Taiwan Gold | black, 9.2 to 1 |
| 16 | `#cdaf77` | `oklch(76.71% 0.0807 82.68)` | Let It Ring | black, 9.9 to 1 |
| 17 | `#ceb078` | `oklch(77.16% 0.0816 82.90)` | Romanesque Gold | black, 10.1 to 1 |
| 18 | `#ccac75` | `oklch(76.03% 0.0815 81.34)` | Sigmarite | black, 9.7 to 1 |
| 19 | `#c6a46f` | `oklch(73.77% 0.0806 78.62)` | Mustard Seed Beige | black, 8.9 to 1 |
| 20 | `#be9a69` | `oklch(70.85% 0.0788 75.35)` | Edgy Green | black, 8 to 1 |
| 21 | `#b59062` | `oklch(67.73% 0.0763 72.15)` | Maple View | black, 7.1 to 1 |
| 22 | `#ac875d` | `oklch(64.77% 0.0733 69.61)` | Roman Coin | black, 6.3 to 1 |
| 23 | `#a17d57` | `oklch(61.50% 0.0693 67.55)` | Agrellan Earth | black, 5.5 to 1 |
| 24 | `#957251` | `oklch(57.89% 0.0645 65.64)` | Sagebrush | black, 4.8 to 1 |
| 25 | `#88684b` | `oklch(54.20% 0.0592 63.60)` | Baked Cookie | white, 5 to 1 |
| 26 | `#7c5e45` | `oklch(50.67% 0.0539 61.20)` | Frontier Shingle | white, 5.9 to 1 |
| 27 | `#715641` | `oklch(47.54% 0.0488 58.17)` | Cinnamon Crumble | white, 6.7 to 1 |
| 28 | `#674e3d` | `oklch(44.59% 0.0433 54.01)` | Tobacco | white, 7.6 to 1 |
| 29 | `#5e473a` | `oklch(41.74% 0.0374 49.05)` | Carafe | white, 8.6 to 1 |
| 30 | `#544038` | `oklch(39.16% 0.0317 44.01)` | Cabin Plank | white, 9.6 to 1 |
| 31 | `#4d3b35` | `oklch(37.00% 0.0269 39.61)` | Button Eyes | white, 10.5 to 1 |
| 32 | `#473833` | `oklch(35.43% 0.0234 36.55)` | Film Noir | white, 11.2 to 1 |

## CSS

```css
background: conic-gradient(from 315deg, #372d2a 0.0%, #3d322d 3.2%, #463831 6.5%, #504037 9.7%, #5b483c 12.9%, #665141 16.1%, #715946 19.4%, #7b614a 22.6%, #86694f 25.8%, #917253 29.0%, #9b7a58 32.3%, #a6845e 35.5%, #b29065 38.7%, #bd9d6c 41.9%, #c6a873 45.2%, #cdaf77 48.4%, #ceb078 51.6%, #ccac75 54.8%, #c6a46f 58.1%, #be9a69 61.3%, #b59062 64.5%, #ac875d 67.7%, #a17d57 71.0%, #957251 74.2%, #88684b 77.4%, #7c5e45 80.6%, #715641 83.9%, #674e3d 87.1%, #5e473a 90.3%, #544038 93.5%, #4d3b35 96.8%, #473833 100.0%);
background: conic-gradient(from 315deg in oklch, oklch(30.71% 0.0152 42.89) 0.0%, oklch(32.65% 0.0182 44.89) 3.2%, oklch(35.38% 0.0224 47.74) 6.5%, oklch(38.58% 0.0274 51.02) 9.7%, oklch(41.94% 0.0326 54.34) 12.9%, oklch(45.17% 0.0378 57.26) 16.1%, oklch(48.16% 0.0428 59.58) 19.4%, oklch(51.20% 0.0481 61.58) 22.6%, oklch(54.26% 0.0534 63.43) 25.8%, oklch(57.33% 0.0586 65.33) 29.0%, oklch(60.40% 0.0633 67.46) 32.3%, oklch(63.65% 0.0675 70.15) 35.5%, oklch(67.45% 0.0716 73.68) 38.7%, oklch(71.30% 0.0754 77.40) 41.9%, oklch(74.58% 0.0785 80.63) 45.2%, oklch(76.71% 0.0807 82.68) 48.4%, oklch(77.16% 0.0816 82.90) 51.6%, oklch(76.03% 0.0815 81.34) 54.8%, oklch(73.77% 0.0806 78.62) 58.1%, oklch(70.85% 0.0788 75.35) 61.3%, oklch(67.73% 0.0763 72.15) 64.5%, oklch(64.77% 0.0733 69.61) 67.7%, oklch(61.50% 0.0693 67.55) 71.0%, oklch(57.89% 0.0645 65.64) 74.2%, oklch(54.20% 0.0592 63.60) 77.4%, oklch(50.67% 0.0539 61.20) 80.6%, oklch(47.54% 0.0488 58.17) 83.9%, oklch(44.59% 0.0433 54.01) 87.1%, oklch(41.74% 0.0374 49.05) 90.3%, oklch(39.16% 0.0317 44.01) 93.5%, oklch(37.00% 0.0269 39.61) 96.8%, oklch(35.43% 0.0234 36.55) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.307 | 0.015 | 42.9 |
| 2 | 0.457 | 0.039 | 57.7 |
| 3 | 0.614 | 0.065 | 68.3 |
| 4 | 0.772 | 0.081 | 83 |
| 5 | 0.657 | 0.074 | 70.4 |
| 6 | 0.48 | 0.05 | 58.7 |
| 7 | 0.354 | 0.023 | 36.6 |

## In these collections

- [Wood color palette](https://grabient.com/wood-color-palette)

## Other forms

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