# Bronze and ochre text palette

The Bronze and ochre text palette brings together orange and gold. The colors span a narrow lightness range, combining strong color with gentle contrast. Its balanced and composed character suits website sections and interface mockups. Its darkest tone is orange, and its lightest tone is gold.

- Also called: Vivid analogous brown to mustard angular gradient
- Seed: `kSel4pSbpBVlBwg`
- Page: https://grabient.com/kSel4pSbpBVlBwg?style=angularGradient&steps=32&angle=180
- Drawn as: angular gradient, 32 steps, 180 degrees
- Kinds: vivid, warm
- Hues: analogous
- Contrast of its darkest and lightest colors: 2.5 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 | `#8d4a00` | `oklch(48.03% 0.1155 57.60)` | Parasite Brown | white, 6.7 to 1 |
| 2 | `#8e4b00` | `oklch(48.39% 0.1158 58.01)` | Parasite Brown | white, 6.6 to 1 |
| 3 | `#8f4c00` | `oklch(48.80% 0.1162 58.49)` | Parasite Brown | white, 6.5 to 1 |
| 4 | `#904e00` | `oklch(49.28% 0.1167 59.03)` | Plain Old Brown | white, 6.4 to 1 |
| 5 | `#924f00` | `oklch(49.82% 0.1173 59.63)` | Plain Old Brown | white, 6.2 to 1 |
| 6 | `#945100` | `oklch(50.40% 0.1179 60.28)` | Mochaccino | white, 6.1 to 1 |
| 7 | `#965300` | `oklch(51.02% 0.1185 60.97)` | Mochaccino | white, 5.9 to 1 |
| 8 | `#975500` | `oklch(51.68% 0.1192 61.72)` | Charlie Brown | white, 5.7 to 1 |
| 9 | `#995700` | `oklch(52.37% 0.1200 62.50)` | Charlie Brown | white, 5.6 to 1 |
| 10 | `#9c5a00` | `oklch(53.08% 0.1207 63.32)` | Sepia Wash | white, 5.4 to 1 |
| 11 | `#9e5c00` | `oklch(53.81% 0.1215 64.18)` | Soft Tone Ink | white, 5.2 to 1 |
| 12 | `#a05f00` | `oklch(54.55% 0.1223 65.06)` | Soft Tone Ink | white, 5.1 to 1 |
| 13 | `#a26100` | `oklch(55.30% 0.1231 65.96)` | Soft Tone Ink | white, 4.9 to 1 |
| 14 | `#a46400` | `oklch(56.05% 0.1240 66.89)` | Cumin Ochre | white, 4.7 to 1 |
| 15 | `#a66600` | `oklch(56.79% 0.1248 67.83)` | Butter Fudge | white, 4.6 to 1 |
| 16 | `#a86900` | `oklch(57.52% 0.1256 68.77)` | Butter Fudge | black, 4.6 to 1 |
| 17 | `#aa6b00` | `oklch(58.24% 0.1264 69.75)` | Butter Fudge | black, 4.8 to 1 |
| 18 | `#ac6e00` | `oklch(59.01% 0.1272 70.82)` | Caramel | black, 4.9 to 1 |
| 19 | `#ae7100` | `oklch(59.84% 0.1281 71.99)` | Cookie Dough | black, 5.1 to 1 |
| 20 | `#b07400` | `oklch(60.71% 0.1292 73.24)` | Philippine Gold | black, 5.3 to 1 |
| 21 | `#b27700` | `oklch(61.61% 0.1302 74.55)` | Golden Brown | black, 5.5 to 1 |
| 22 | `#b47b00` | `oklch(62.53% 0.1314 75.90)` | Golden Brown | black, 5.7 to 1 |
| 23 | `#b77e00` | `oklch(63.45% 0.1326 77.26)` | Guo Tie Dumpling | black, 5.9 to 1 |
| 24 | `#b98100` | `oklch(64.37% 0.1339 78.63)` | Guo Tie Dumpling | black, 6.2 to 1 |
| 25 | `#bb8500` | `oklch(65.26% 0.1352 79.98)` | Fig Mustard Yellow | black, 6.4 to 1 |
| 26 | `#bd8800` | `oklch(66.13% 0.1365 81.29)` | Kenyan Sand | black, 6.6 to 1 |
| 27 | `#be8b00` | `oklch(66.96% 0.1378 82.54)` | Kenyan Sand | black, 6.9 to 1 |
| 28 | `#c08e00` | `oklch(67.74% 0.1391 83.72)` | Moutarde de Bénichon | black, 7.1 to 1 |
| 29 | `#c19100` | `oklch(68.45% 0.1403 84.79)` | Moutarde de Bénichon | black, 7.3 to 1 |
| 30 | `#c39400` | `oklch(69.08% 0.1415 85.75)` | Nugget Gold | black, 7.5 to 1 |
| 31 | `#c49600` | `oklch(69.63% 0.1425 86.57)` | Rapeseed | black, 7.6 to 1 |
| 32 | `#c59700` | `oklch(70.08% 0.1433 87.23)` | Rapeseed | black, 7.8 to 1 |

## CSS

```css
background: conic-gradient(from 180deg, #8d4a00 0.0%, #8e4b00 3.2%, #8f4c00 6.5%, #904e00 9.7%, #924f00 12.9%, #945100 16.1%, #965300 19.4%, #975500 22.6%, #995700 25.8%, #9c5a00 29.0%, #9e5c00 32.3%, #a05f00 35.5%, #a26100 38.7%, #a46400 41.9%, #a66600 45.2%, #a86900 48.4%, #aa6b00 51.6%, #ac6e00 54.8%, #ae7100 58.1%, #b07400 61.3%, #b27700 64.5%, #b47b00 67.7%, #b77e00 71.0%, #b98100 74.2%, #bb8500 77.4%, #bd8800 80.6%, #be8b00 83.9%, #c08e00 87.1%, #c19100 90.3%, #c39400 93.5%, #c49600 96.8%, #c59700 100.0%);
background: conic-gradient(from 180deg in oklch, oklch(48.03% 0.1155 57.60) 0.0%, oklch(48.39% 0.1158 58.01) 3.2%, oklch(48.80% 0.1162 58.49) 6.5%, oklch(49.28% 0.1167 59.03) 9.7%, oklch(49.82% 0.1173 59.63) 12.9%, oklch(50.40% 0.1179 60.28) 16.1%, oklch(51.02% 0.1185 60.97) 19.4%, oklch(51.68% 0.1192 61.72) 22.6%, oklch(52.37% 0.1200 62.50) 25.8%, oklch(53.08% 0.1207 63.32) 29.0%, oklch(53.81% 0.1215 64.18) 32.3%, oklch(54.55% 0.1223 65.06) 35.5%, oklch(55.30% 0.1231 65.96) 38.7%, oklch(56.05% 0.1240 66.89) 41.9%, oklch(56.79% 0.1248 67.83) 45.2%, oklch(57.52% 0.1256 68.77) 48.4%, oklch(58.24% 0.1264 69.75) 51.6%, oklch(59.01% 0.1272 70.82) 54.8%, oklch(59.84% 0.1281 71.99) 58.1%, oklch(60.71% 0.1292 73.24) 61.3%, oklch(61.61% 0.1302 74.55) 64.5%, oklch(62.53% 0.1314 75.90) 67.7%, oklch(63.45% 0.1326 77.26) 71.0%, oklch(64.37% 0.1339 78.63) 74.2%, oklch(65.26% 0.1352 79.98) 77.4%, oklch(66.13% 0.1365 81.29) 80.6%, oklch(66.96% 0.1378 82.54) 83.9%, oklch(67.74% 0.1391 83.72) 87.1%, oklch(68.45% 0.1403 84.79) 90.3%, oklch(69.08% 0.1415 85.75) 93.5%, oklch(69.63% 0.1425 86.57) 96.8%, oklch(70.08% 0.1433 87.23) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.48 | 0.13 | 57.7 |
| 2 | 0.579 | 0.16 | 69.3 |
| 3 | 0.701 | 0.181 | 87.2 |

## In these collections

- [Text gradients](https://grabient.com/text-gradients)

## Other forms

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