# Vivid analogous orange to tan linear gradient

Vivid analogous orange to tan linear gradient with 32 colors: #b15802, #b35a01, #b65d00, #b86100, #bb6500, #bf6900, #c26e00, #c67300, #c97800, #cd7d02, #d08204, #d48606, #d88c06, #dd9106, #e19706, #e69d06, #eaa308, #eea90d, #f2ae13, #f6b41b, #f8b924, #fabe2d, #fcc238, #fdc743, #fecb4e, #fece59, #ffd263, #ffd56c, #ffd874, #ffda7b, #ffdc81, #ffde86. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kUjmYmVjXBum6wbzqcCg`
- Page: https://grabient.com/kUjmYmVjXBum6wbzqcCg?steps=32
- Drawn as: linear gradient, 32 steps, 90 degrees
- Kinds: dark to light, vivid, warm
- Hues: analogous
- Contrast of its darkest and lightest colors: 3.7 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 | `#b15802` | `oklch(55.91% 0.1406 53.44)` | Elm Brown Red | white, 4.9 to 1 |
| 2 | `#b35a01` | `oklch(56.57% 0.1409 54.29)` | Elm Brown Red | white, 4.7 to 1 |
| 3 | `#b65d00` | `oklch(57.39% 0.1413 55.37)` | Orangish Brown | white, 4.6 to 1 |
| 4 | `#b86100` | `oklch(58.37% 0.1418 56.63)` | Honey Ginger | black, 4.7 to 1 |
| 5 | `#bb6500` | `oklch(59.46% 0.1422 58.06)` | Camel Fur | black, 4.9 to 1 |
| 6 | `#bf6900` | `oklch(60.65% 0.1428 59.62)` | Hawaiian Sunset | black, 5.2 to 1 |
| 7 | `#c26e00` | `oklch(61.91% 0.1435 61.25)` | Sludge | black, 5.5 to 1 |
| 8 | `#c67300` | `oklch(63.23% 0.1443 62.91)` | Dirty Orange | black, 5.8 to 1 |
| 9 | `#c97800` | `oklch(64.58% 0.1453 64.60)` | Mountain Ash | black, 6.1 to 1 |
| 10 | `#cd7d02` | `oklch(65.93% 0.1462 66.22)` | Seabuckthorn Yellow Brown | black, 6.5 to 1 |
| 11 | `#d08204` | `oklch(67.28% 0.1471 67.75)` | Copious Caramel | black, 6.8 to 1 |
| 12 | `#d48606` | `oklch(68.62% 0.1483 69.20)` | Dulce de Leche | black, 7.2 to 1 |
| 13 | `#d88c06` | `oklch(70.07% 0.1499 70.71)` | Fleur de Sel Caramel | black, 7.6 to 1 |
| 14 | `#dd9106` | `oklch(71.61% 0.1520 72.26)` | Harvest Eve Gold | black, 8.1 to 1 |
| 15 | `#e19706` | `oklch(73.21% 0.1543 73.83)` | Golden Key | black, 8.6 to 1 |
| 16 | `#e69d06` | `oklch(74.83% 0.1566 75.39)` | Hot Butter | black, 9.1 to 1 |
| 17 | `#eaa308` | `oklch(76.45% 0.1587 76.92)` | Orange Sulphur | black, 9.7 to 1 |
| 18 | `#eea90d` | `oklch(78.03% 0.1605 78.40)` | Groovy Giraffe | black, 10.3 to 1 |
| 19 | `#f2ae13` | `oklch(79.55% 0.1618 79.81)` | Spicy Sweetcorn | black, 10.8 to 1 |
| 20 | `#f6b41b` | `oklch(80.98% 0.1624 81.12)` | Spanish Yellow | black, 11.4 to 1 |
| 21 | `#f8b924` | `oklch(82.28% 0.1620 82.31)` | Glistening Dawn | black, 11.9 to 1 |
| 22 | `#fabe2d` | `oklch(83.44% 0.1606 83.36)` | Sunflower Valley | black, 12.4 to 1 |
| 23 | `#fcc238` | `oklch(84.51% 0.1578 84.30)` | Not Yo Cheese | black, 12.9 to 1 |
| 24 | `#fdc743` | `oklch(85.51% 0.1538 85.16)` | Sunny Festival | black, 13.3 to 1 |
| 25 | `#fecb4e` | `oklch(86.44% 0.1489 85.92)` | Capricorn Golden Key | black, 13.8 to 1 |
| 26 | `#fece59` | `oklch(87.30% 0.1435 86.61)` | Casandora Yellow | black, 14.2 to 1 |
| 27 | `#ffd263` | `oklch(88.09% 0.1377 87.22)` | Bright Halo | black, 14.6 to 1 |
| 28 | `#ffd56c` | `oklch(88.81% 0.1319 87.76)` | Hint of Honey | black, 14.9 to 1 |
| 29 | `#ffd874` | `oklch(89.46% 0.1264 88.24)` | Honey Glaze | black, 15.2 to 1 |
| 30 | `#ffda7b` | `oklch(90.03% 0.1214 88.67)` | Pina | black, 15.5 to 1 |
| 31 | `#ffdc81` | `oklch(90.52% 0.1171 89.05)` | Spirited Yellow | black, 15.8 to 1 |
| 32 | `#ffde86` | `oklch(90.94% 0.1132 89.37)` | Yellow Corn | black, 16 to 1 |

## CSS

```css
background: linear-gradient(90deg, #b15802 0.0%, #b35a01 3.2%, #b65d00 6.5%, #b86100 9.7%, #bb6500 12.9%, #bf6900 16.1%, #c26e00 19.4%, #c67300 22.6%, #c97800 25.8%, #cd7d02 29.0%, #d08204 32.3%, #d48606 35.5%, #d88c06 38.7%, #dd9106 41.9%, #e19706 45.2%, #e69d06 48.4%, #eaa308 51.6%, #eea90d 54.8%, #f2ae13 58.1%, #f6b41b 61.3%, #f8b924 64.5%, #fabe2d 67.7%, #fcc238 71.0%, #fdc743 74.2%, #fecb4e 77.4%, #fece59 80.6%, #ffd263 83.9%, #ffd56c 87.1%, #ffd874 90.3%, #ffda7b 93.5%, #ffdc81 96.8%, #ffde86 100.0%);
background: linear-gradient(90deg in oklch, oklch(55.91% 0.1406 53.44) 0.0%, oklch(56.57% 0.1409 54.29) 3.2%, oklch(57.39% 0.1413 55.37) 6.5%, oklch(58.37% 0.1418 56.63) 9.7%, oklch(59.46% 0.1422 58.06) 12.9%, oklch(60.65% 0.1428 59.62) 16.1%, oklch(61.91% 0.1435 61.25) 19.4%, oklch(63.23% 0.1443 62.91) 22.6%, oklch(64.58% 0.1453 64.60) 25.8%, oklch(65.93% 0.1462 66.22) 29.0%, oklch(67.28% 0.1471 67.75) 32.3%, oklch(68.62% 0.1483 69.20) 35.5%, oklch(70.07% 0.1499 70.71) 38.7%, oklch(71.61% 0.1520 72.26) 41.9%, oklch(73.21% 0.1543 73.83) 45.2%, oklch(74.83% 0.1566 75.39) 48.4%, oklch(76.45% 0.1587 76.92) 51.6%, oklch(78.03% 0.1605 78.40) 54.8%, oklch(79.55% 0.1618 79.81) 58.1%, oklch(80.98% 0.1624 81.12) 61.3%, oklch(82.28% 0.1620 82.31) 64.5%, oklch(83.44% 0.1606 83.36) 67.7%, oklch(84.51% 0.1578 84.30) 71.0%, oklch(85.51% 0.1538 85.16) 74.2%, oklch(86.44% 0.1489 85.92) 77.4%, oklch(87.30% 0.1435 86.61) 80.6%, oklch(88.09% 0.1377 87.22) 83.9%, oklch(88.81% 0.1319 87.76) 87.1%, oklch(89.46% 0.1264 88.24) 90.3%, oklch(90.03% 0.1214 88.67) 93.5%, oklch(90.52% 0.1171 89.05) 96.8%, oklch(90.94% 0.1132 89.37) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.559 | 0.141 | 53.4 |
| 2 | 0.677 | 0.147 | 68.2 |
| 3 | 0.831 | 0.161 | 83 |
| 4 | 0.909 | 0.114 | 89.4 |

## In these collections

- [Autumn gradients](https://grabient.com/autumn-gradients)
- [Yellow swatches](https://grabient.com/yellow-swatches)

## Other forms

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