# Bronze, ochre and near-black color palette

The Bronze, ochre and near-black color palette brings together orange, gold, dark green, and black. The colors span a broad lightness range, combining moderate color with clear contrast. Its balanced and composed character suits website sections and interface mockups. Its darkest tone is black, and its lightest tone is orange.

- Also called: Analogous brown, orange and black linear gradient
- Seed: `kWllko2jHA8aewgfC8gAovOg`
- Page: https://grabient.com/kWllko2jHA8aewgfC8gAovOg?steps=24
- Drawn as: linear gradient, 24 steps, 90 degrees
- Kinds: light center, vivid
- Hues: analogous
- Contrast of its darkest and lightest colors: 7.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 | `#b36828` | `oklch(59.06% 0.1226 56.95)` | Dirty Brown | black, 4.9 to 1 |
| 2 | `#b96d2a` | `oklch(60.75% 0.1250 57.80)` | Brown Alpaca | black, 5.2 to 1 |
| 3 | `#c3742d` | `oklch(63.36% 0.1290 58.89)` | Orange Squash | black, 5.8 to 1 |
| 4 | `#cd7d30` | `oklch(66.28% 0.1333 60.24)` | Polished Bronze | black, 6.5 to 1 |
| 5 | `#d68533` | `oklch(68.89% 0.1367 61.86)` | Sunlounge | black, 7.2 to 1 |
| 6 | `#db8b35` | `oklch(70.58% 0.1378 63.77)` | Status Bronze | black, 7.7 to 1 |
| 7 | `#d98e36` | `oklch(70.75% 0.1355 65.95)` | Soft Pumpkin | black, 7.8 to 1 |
| 8 | `#d28c37` | `oklch(69.63% 0.1294 67.74)` | Caramelise | black, 7.5 to 1 |
| 9 | `#c68839` | `oklch(67.56% 0.1207 69.38)` | Gold Coast | black, 7 to 1 |
| 10 | `#b8823a` | `oklch(64.73% 0.1104 71.53)` | Monarch Gold | black, 6.2 to 1 |
| 11 | `#a77b39` | `oklch(61.32% 0.0994 74.83)` | Rich Sorrel | black, 5.5 to 1 |
| 12 | `#947336` | `oklch(57.51% 0.0888 79.94)` | California Gold Rush | black, 4.7 to 1 |
| 13 | `#806a32` | `oklch(53.35% 0.0793 87.32)` | By Gum | white, 5.2 to 1 |
| 14 | `#6a5e2e` | `oklch(48.30% 0.0691 96.29)` | Saguaro | white, 6.4 to 1 |
| 15 | `#525129` | `oklch(42.62% 0.0585 106.78)` | Warplock Bronze | white, 8.1 to 1 |
| 16 | `#3c4325` | `oklch(36.69% 0.0484 118.84)` | Deep Seaweed | white, 10.4 to 1 |
| 17 | `#28341f` | `oklch(30.89% 0.0396 132.53)` | Rangitoto | white, 13 to 1 |
| 18 | `#18271a` | `oklch(25.60% 0.0329 147.94)` | Deep Slate Olive | white, 15.5 to 1 |
| 19 | `#091c15` | `oklch(20.89% 0.0291 166.39)` | Pinch of Pepper | white, 17.6 to 1 |
| 20 | `#001110` | `oklch(16.22% 0.0278 189.63)` | Black Glaze | white, 19.2 to 1 |
| 21 | `#00070a` | `oklch(11.84% 0.0211 216.25)` | Eight Ball | white, 20.2 to 1 |
| 22 | `#000205` | `oklch(7.92% 0.0203 245.89)` | Black Hole | white, 20.7 to 1 |
| 23 | `#000003` | `oklch(4.50% 0.0305 264.13)` | Binary Black | white, 20.9 to 1 |
| 24 | `#000001` | `oklch(3.47% 0.0212 278.49)` | Black | white, 20.9 to 1 |

## CSS

```css
background: linear-gradient(90deg, #b36828 0.0%, #b96d2a 4.3%, #c3742d 8.7%, #cd7d30 13.0%, #d68533 17.4%, #db8b35 21.7%, #d98e36 26.1%, #d28c37 30.4%, #c68839 34.8%, #b8823a 39.1%, #a77b39 43.5%, #947336 47.8%, #806a32 52.2%, #6a5e2e 56.5%, #525129 60.9%, #3c4325 65.2%, #28341f 69.6%, #18271a 73.9%, #091c15 78.3%, #001110 82.6%, #00070a 87.0%, #000205 91.3%, #000003 95.7%, #000001 100.0%);
background: linear-gradient(90deg in oklch, oklch(59.06% 0.1226 56.95) 0.0%, oklch(60.75% 0.1250 57.80) 4.3%, oklch(63.36% 0.1290 58.89) 8.7%, oklch(66.28% 0.1333 60.24) 13.0%, oklch(68.89% 0.1367 61.86) 17.4%, oklch(70.58% 0.1378 63.77) 21.7%, oklch(70.75% 0.1355 65.95) 26.1%, oklch(69.63% 0.1294 67.74) 30.4%, oklch(67.56% 0.1207 69.38) 34.8%, oklch(64.73% 0.1104 71.53) 39.1%, oklch(61.32% 0.0994 74.83) 43.5%, oklch(57.51% 0.0888 79.94) 47.8%, oklch(53.35% 0.0793 87.32) 52.2%, oklch(48.30% 0.0691 96.29) 56.5%, oklch(42.62% 0.0585 106.78) 60.9%, oklch(36.69% 0.0484 118.84) 65.2%, oklch(30.89% 0.0396 132.53) 69.6%, oklch(25.60% 0.0329 147.94) 73.9%, oklch(20.89% 0.0291 166.39) 78.3%, oklch(16.22% 0.0278 189.63) 82.6%, oklch(11.84% 0.0211 216.25) 87.0%, oklch(7.92% 0.0203 245.89) 91.3%, oklch(4.50% 0.0305 264.13) 95.7%, oklch(3.47% 0.0212 278.49) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.591 | 0.123 | 57 |
| 2 | 0.709 | 0.136 | 65.4 |
| 3 | 0.555 | 0.084 | 83.4 |
| 4 | 0.244 | 0.032 | 152.1 |
| 5 | 0.02 | 0.032 | 275.7 |

## In these collections

- [Autumn gradients](https://grabient.com/autumn-gradients)
- [Wallpaper gradients](https://grabient.com/wallpaper-gradients)
- [Text gradients](https://grabient.com/text-gradients)
- [Retro gradients](https://grabient.com/retro-gradients)

## Other forms

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