# Warm ochre and toasted brown

Warm ochre moves into toasted brown in a restrained angular gradient. Golden earth tones soften through tan and darker brown, forming a close, warm color relationship without a contrasting accent. The palette evokes aged leather, dry leaves and natural wood, making it suitable for autumn imagery and earthy editorial layouts.

- Also called: Vivid monochrome brown angular gradient
- Seed: `kQo1Q3OxW9Q`
- Page: https://grabient.com/kQo1Q3OxW9Q?style=angularGradient&steps=68&angle=280
- Drawn as: angular gradient, 68 steps, 280 degrees
- Kinds: vivid, warm, monochrome
- Hues: analogous
- Contrast of its darkest and lightest colors: 2 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 | `#b4832d` | `oklch(64.17% 0.1157 77.34)` | Nouveau Green | black, 6.1 to 1 |
| 2 | `#b3822e` | `oklch(64.04% 0.1153 77.17)` | Nouveau Green | black, 6.1 to 1 |
| 3 | `#b3822e` | `oklch(63.89% 0.1148 76.98)` | Nouveau Green | black, 6.1 to 1 |
| 4 | `#b2812e` | `oklch(63.72% 0.1143 76.78)` | Gilded Gold | black, 6 to 1 |
| 5 | `#b2812e` | `oklch(63.55% 0.1138 76.57)` | Gilded Gold | black, 6 to 1 |
| 6 | `#b1802f` | `oklch(63.37% 0.1132 76.34)` | Gilded Gold | black, 5.9 to 1 |
| 7 | `#b07f2f` | `oklch(63.18% 0.1126 76.10)` | Bronze Leaf | black, 5.9 to 1 |
| 8 | `#b07f2f` | `oklch(62.98% 0.1119 75.85)` | Bronze Leaf | black, 5.8 to 1 |
| 9 | `#af7e2f` | `oklch(62.77% 0.1113 75.58)` | Release the Hounds | black, 5.8 to 1 |
| 10 | `#ae7d30` | `oklch(62.55% 0.1106 75.31)` | Release the Hounds | black, 5.7 to 1 |
| 11 | `#ad7d30` | `oklch(62.32% 0.1098 75.02)` | Release the Hounds | black, 5.7 to 1 |
| 12 | `#ad7c30` | `oklch(62.08% 0.1091 74.72)` | Release the Hounds | black, 5.6 to 1 |
| 13 | `#ac7b31` | `oklch(61.84% 0.1083 74.42)` | Release the Hounds | black, 5.6 to 1 |
| 14 | `#ab7a31` | `oklch(61.58% 0.1075 74.10)` | Chai Tea | black, 5.5 to 1 |
| 15 | `#aa7931` | `oklch(61.32% 0.1067 73.77)` | Buff Leather | black, 5.5 to 1 |
| 16 | `#a97932` | `oklch(61.06% 0.1058 73.44)` | Buff Leather | black, 5.4 to 1 |
| 17 | `#a87832` | `oklch(60.78% 0.1049 73.10)` | Buff Leather | black, 5.3 to 1 |
| 18 | `#a77732` | `oklch(60.50% 0.1040 72.75)` | Buff Leather | black, 5.3 to 1 |
| 19 | `#a67633` | `oklch(60.22% 0.1031 72.39)` | Hot Toddy | black, 5.2 to 1 |
| 20 | `#a57533` | `oklch(59.93% 0.1022 72.03)` | Hot Toddy | black, 5.2 to 1 |
| 21 | `#a47433` | `oklch(59.63% 0.1013 71.66)` | Digger’s Gold | black, 5.1 to 1 |
| 22 | `#a37333` | `oklch(59.33% 0.1003 71.28)` | Digger’s Gold | black, 5 to 1 |
| 23 | `#a27234` | `oklch(59.03% 0.0993 70.90)` | Digger’s Gold | black, 5 to 1 |
| 24 | `#a17134` | `oklch(58.72% 0.0983 70.51)` | Hearth Gold | black, 4.9 to 1 |
| 25 | `#a07134` | `oklch(58.40% 0.0974 70.12)` | Hearth Gold | black, 4.8 to 1 |
| 26 | `#9f7035` | `oklch(58.09% 0.0963 69.72)` | Hearth Gold | black, 4.8 to 1 |
| 27 | `#9e6f35` | `oklch(57.77% 0.0953 69.32)` | Hearth Gold | black, 4.7 to 1 |
| 28 | `#9d6e35` | `oklch(57.45% 0.0943 68.92)` | Damascene | black, 4.6 to 1 |
| 29 | `#9c6d35` | `oklch(57.12% 0.0933 68.51)` | Damascene | black, 4.6 to 1 |
| 30 | `#9a6c36` | `oklch(56.80% 0.0922 68.10)` | Horsing Around | white, 4.5 to 1 |
| 31 | `#996b36` | `oklch(56.47% 0.0912 67.69)` | Horsing Around | white, 4.6 to 1 |
| 32 | `#986a36` | `oklch(56.14% 0.0901 67.28)` | Vintage Caramel | white, 4.7 to 1 |
| 33 | `#976936` | `oklch(55.81% 0.0891 66.87)` | Vintage Caramel | white, 4.7 to 1 |
| 34 | `#966837` | `oklch(55.48% 0.0880 66.45)` | Woodgrain | white, 4.8 to 1 |
| 35 | `#946737` | `oklch(55.15% 0.0870 66.04)` | Retrofit | white, 4.9 to 1 |
| 36 | `#936637` | `oklch(54.82% 0.0859 65.63)` | Retrofit | white, 4.9 to 1 |
| 37 | `#926537` | `oklch(54.49% 0.0849 65.21)` | Retrofit | white, 5 to 1 |
| 38 | `#916437` | `oklch(54.16% 0.0838 64.80)` | Oregon Hazel | white, 5.1 to 1 |
| 39 | `#906337` | `oklch(53.83% 0.0828 64.39)` | Oregon Hazel | white, 5.2 to 1 |
| 40 | `#8e6338` | `oklch(53.51% 0.0817 63.98)` | McKenzie | white, 5.2 to 1 |
| 41 | `#8d6238` | `oklch(53.18% 0.0807 63.58)` | McKenzie | white, 5.3 to 1 |
| 42 | `#8c6138` | `oklch(52.86% 0.0797 63.17)` | McKenzie | white, 5.4 to 1 |
| 43 | `#8b6038` | `oklch(52.54% 0.0787 62.77)` | Quiver | white, 5.4 to 1 |
| 44 | `#8a5f38` | `oklch(52.23% 0.0776 62.38)` | Quiver | white, 5.5 to 1 |
| 45 | `#885e38` | `oklch(51.91% 0.0767 61.99)` | Quiver | white, 5.6 to 1 |
| 46 | `#875d38` | `oklch(51.60% 0.0757 61.60)` | Quiver | white, 5.7 to 1 |
| 47 | `#865d38` | `oklch(51.30% 0.0747 61.22)` | Rubber | white, 5.7 to 1 |
| 48 | `#855c38` | `oklch(51.00% 0.0737 60.84)` | Rubber | white, 5.8 to 1 |
| 49 | `#845b38` | `oklch(50.70% 0.0728 60.47)` | Rubber | white, 5.9 to 1 |
| 50 | `#835a39` | `oklch(50.41% 0.0719 60.11)` | Football | white, 6 to 1 |
| 51 | `#825a39` | `oklch(50.13% 0.0710 59.75)` | Football | white, 6 to 1 |
| 52 | `#805939` | `oklch(49.85% 0.0701 59.40)` | Football | white, 6.1 to 1 |
| 53 | `#7f5839` | `oklch(49.57% 0.0692 59.06)` | Château Mantle | white, 6.2 to 1 |
| 54 | `#7e5739` | `oklch(49.31% 0.0683 58.72)` | Château Mantle | white, 6.3 to 1 |
| 55 | `#7d5739` | `oklch(49.05% 0.0675 58.40)` | Château Mantle | white, 6.3 to 1 |
| 56 | `#7c5639` | `oklch(48.79% 0.0667 58.08)` | Château Mantle | white, 6.4 to 1 |
| 57 | `#7b5639` | `oklch(48.55% 0.0659 57.77)` | Emperador | white, 6.5 to 1 |
| 58 | `#7b5539` | `oklch(48.31% 0.0652 57.48)` | Emperador | white, 6.5 to 1 |
| 59 | `#7a5439` | `oklch(48.08% 0.0644 57.19)` | Pheasant Brown | white, 6.6 to 1 |
| 60 | `#795439` | `oklch(47.86% 0.0637 56.91)` | Pheasant Brown | white, 6.7 to 1 |
| 61 | `#785339` | `oklch(47.65% 0.0631 56.65)` | Pheasant Brown | white, 6.7 to 1 |
| 62 | `#775339` | `oklch(47.45% 0.0624 56.40)` | Umber Rust | white, 6.8 to 1 |
| 63 | `#765239` | `oklch(47.26% 0.0618 56.16)` | Umber Rust | white, 6.8 to 1 |
| 64 | `#765239` | `oklch(47.08% 0.0612 55.93)` | Umber Rust | white, 6.9 to 1 |
| 65 | `#755239` | `oklch(46.91% 0.0607 55.71)` | Toffee | white, 6.9 to 1 |
| 66 | `#745139` | `oklch(46.74% 0.0602 55.51)` | Toffee | white, 7 to 1 |
| 67 | `#745139` | `oklch(46.59% 0.0597 55.32)` | Toffee | white, 7 to 1 |
| 68 | `#735039` | `oklch(46.46% 0.0593 55.15)` | Old Copper | white, 7.1 to 1 |

## CSS

```css
background: conic-gradient(from 280deg, #b4832d 0.0%, #b3822e 1.5%, #b3822e 3.0%, #b2812e 4.5%, #b2812e 6.0%, #b1802f 7.5%, #b07f2f 9.0%, #b07f2f 10.4%, #af7e2f 11.9%, #ae7d30 13.4%, #ad7d30 14.9%, #ad7c30 16.4%, #ac7b31 17.9%, #ab7a31 19.4%, #aa7931 20.9%, #a97932 22.4%, #a87832 23.9%, #a77732 25.4%, #a67633 26.9%, #a57533 28.4%, #a47433 29.9%, #a37333 31.3%, #a27234 32.8%, #a17134 34.3%, #a07134 35.8%, #9f7035 37.3%, #9e6f35 38.8%, #9d6e35 40.3%, #9c6d35 41.8%, #9a6c36 43.3%, #996b36 44.8%, #986a36 46.3%, #976936 47.8%, #966837 49.3%, #946737 50.7%, #936637 52.2%, #926537 53.7%, #916437 55.2%, #906337 56.7%, #8e6338 58.2%, #8d6238 59.7%, #8c6138 61.2%, #8b6038 62.7%, #8a5f38 64.2%, #885e38 65.7%, #875d38 67.2%, #865d38 68.7%, #855c38 70.1%, #845b38 71.6%, #835a39 73.1%, #825a39 74.6%, #805939 76.1%, #7f5839 77.6%, #7e5739 79.1%, #7d5739 80.6%, #7c5639 82.1%, #7b5639 83.6%, #7b5539 85.1%, #7a5439 86.6%, #795439 88.1%, #785339 89.6%, #775339 91.0%, #765239 92.5%, #765239 94.0%, #755239 95.5%, #745139 97.0%, #745139 98.5%, #735039 100.0%);
background: conic-gradient(from 280deg in oklch, oklch(64.17% 0.1157 77.34) 0.0%, oklch(64.04% 0.1153 77.17) 1.5%, oklch(63.89% 0.1148 76.98) 3.0%, oklch(63.72% 0.1143 76.78) 4.5%, oklch(63.55% 0.1138 76.57) 6.0%, oklch(63.37% 0.1132 76.34) 7.5%, oklch(63.18% 0.1126 76.10) 9.0%, oklch(62.98% 0.1119 75.85) 10.4%, oklch(62.77% 0.1113 75.58) 11.9%, oklch(62.55% 0.1106 75.31) 13.4%, oklch(62.32% 0.1098 75.02) 14.9%, oklch(62.08% 0.1091 74.72) 16.4%, oklch(61.84% 0.1083 74.42) 17.9%, oklch(61.58% 0.1075 74.10) 19.4%, oklch(61.32% 0.1067 73.77) 20.9%, oklch(61.06% 0.1058 73.44) 22.4%, oklch(60.78% 0.1049 73.10) 23.9%, oklch(60.50% 0.1040 72.75) 25.4%, oklch(60.22% 0.1031 72.39) 26.9%, oklch(59.93% 0.1022 72.03) 28.4%, oklch(59.63% 0.1013 71.66) 29.9%, oklch(59.33% 0.1003 71.28) 31.3%, oklch(59.03% 0.0993 70.90) 32.8%, oklch(58.72% 0.0983 70.51) 34.3%, oklch(58.40% 0.0974 70.12) 35.8%, oklch(58.09% 0.0963 69.72) 37.3%, oklch(57.77% 0.0953 69.32) 38.8%, oklch(57.45% 0.0943 68.92) 40.3%, oklch(57.12% 0.0933 68.51) 41.8%, oklch(56.80% 0.0922 68.10) 43.3%, oklch(56.47% 0.0912 67.69) 44.8%, oklch(56.14% 0.0901 67.28) 46.3%, oklch(55.81% 0.0891 66.87) 47.8%, oklch(55.48% 0.0880 66.45) 49.3%, oklch(55.15% 0.0870 66.04) 50.7%, oklch(54.82% 0.0859 65.63) 52.2%, oklch(54.49% 0.0849 65.21) 53.7%, oklch(54.16% 0.0838 64.80) 55.2%, oklch(53.83% 0.0828 64.39) 56.7%, oklch(53.51% 0.0817 63.98) 58.2%, oklch(53.18% 0.0807 63.58) 59.7%, oklch(52.86% 0.0797 63.17) 61.2%, oklch(52.54% 0.0787 62.77) 62.7%, oklch(52.23% 0.0776 62.38) 64.2%, oklch(51.91% 0.0767 61.99) 65.7%, oklch(51.60% 0.0757 61.60) 67.2%, oklch(51.30% 0.0747 61.22) 68.7%, oklch(51.00% 0.0737 60.84) 70.1%, oklch(50.70% 0.0728 60.47) 71.6%, oklch(50.41% 0.0719 60.11) 73.1%, oklch(50.13% 0.0710 59.75) 74.6%, oklch(49.85% 0.0701 59.40) 76.1%, oklch(49.57% 0.0692 59.06) 77.6%, oklch(49.31% 0.0683 58.72) 79.1%, oklch(49.05% 0.0675 58.40) 80.6%, oklch(48.79% 0.0667 58.08) 82.1%, oklch(48.55% 0.0659 57.77) 83.6%, oklch(48.31% 0.0652 57.48) 85.1%, oklch(48.08% 0.0644 57.19) 86.6%, oklch(47.86% 0.0637 56.91) 88.1%, oklch(47.65% 0.0631 56.65) 89.6%, oklch(47.45% 0.0624 56.40) 91.0%, oklch(47.26% 0.0618 56.16) 92.5%, oklch(47.08% 0.0612 55.93) 94.0%, oklch(46.91% 0.0607 55.71) 95.5%, oklch(46.74% 0.0602 55.51) 97.0%, oklch(46.59% 0.0597 55.32) 98.5%, oklch(46.46% 0.0593 55.15) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.642 | 0.116 | 77.3 |
| 2 | 0.465 | 0.059 | 55.2 |

## In these collections

- [Two color gradients](https://grabient.com/two-color-gradients)

## Other forms

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