# Tan, yellow, orange and teal angular gradient

Tan, yellow, orange and teal angular gradient with 32 colors: #bdbb92, #c2c08a, #c9c67e, #d1cd6d, #d8d15c, #ddd24d, #e1cf42, #e4cb39, #e6c531, #e8bf27, #e9b61a, #e8ac0e, #e7a208, #e49a0a, #e0940f, #db8e16, #d68a1b, #d0881f, #ca8922, #c28e29, #b99535, #af9d42, #a7a44f, #9fac5b, #97b667, #8dc076, #80c885, #74ce94, #67d0a2, #5dd1af, #55d1b8, #52d0bf. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kcxyhLa7S_-g5vnduD21rG_tmnRFiq8T46nDo`
- Page: https://grabient.com/kcxyhLa7S_-g5vnduD21rG_tmnRFiq8T46nDo?style=angularGradient&steps=32&angle=135
- Drawn as: angular gradient, 32 steps, 135 degrees
- Kinds: vivid, warm, multicolor
- Hues: wide
- Contrast of its darkest and lightest colors: 1.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 | `#bdbb92` | `oklch(78.35% 0.0551 105.47)` | Back to Nature | black, 10.6 to 1 |
| 2 | `#c2c08a` | `oklch(79.52% 0.0708 105.72)` | Wheat Grass | black, 11.1 to 1 |
| 3 | `#c9c67e` | `oklch(81.27% 0.0937 106.18)` | Soda Pop | black, 11.8 to 1 |
| 4 | `#d1cd6d` | `oklch(83.06% 0.1182 106.41)` | Force of Nature | black, 12.6 to 1 |
| 5 | `#d8d15c` | `oklch(84.37% 0.1386 105.97)` | Sequesta | black, 13.1 to 1 |
| 6 | `#ddd24d` | `oklch(84.77% 0.1503 104.50)` | Matcha | black, 13.3 to 1 |
| 7 | `#e1cf42` | `oklch(84.56% 0.1559 102.16)` | Crazy | black, 13.2 to 1 |
| 8 | `#e4cb39` | `oklch(83.90% 0.1578 99.20)` | Crazy | black, 12.9 to 1 |
| 9 | `#e6c531` | `oklch(82.91% 0.1581 95.83)` | Thai Temple | black, 12.4 to 1 |
| 10 | `#e8bf27` | `oklch(81.70% 0.1586 92.26)` | Bright Sun | black, 11.8 to 1 |
| 11 | `#e9b61a` | `oklch(80.08% 0.1590 87.91)` | Deli Yellow | black, 11.1 to 1 |
| 12 | `#e8ac0e` | `oklch(78.08% 0.1585 82.97)` | Sun Song | black, 10.3 to 1 |
| 13 | `#e7a208` | `oklch(75.99% 0.1571 78.24)` | Rowdy Orange | black, 9.5 to 1 |
| 14 | `#e49a0a` | `oklch(74.09% 0.1550 74.53)` | Gamboge | black, 8.9 to 1 |
| 15 | `#e0940f` | `oklch(72.49% 0.1523 72.04)` | Beige Red | black, 8.3 to 1 |
| 16 | `#db8e16` | `oklch(70.93% 0.1489 69.92)` | Harvest Eve Gold | black, 7.9 to 1 |
| 17 | `#d68a1b` | `oklch(69.54% 0.1448 68.85)` | Apricot Chicken | black, 7.5 to 1 |
| 18 | `#d0881f` | `oklch(68.52% 0.1401 69.59)` | Chicken Masala | black, 7.2 to 1 |
| 19 | `#ca8922` | `oklch(68.03% 0.1348 72.92)` | Chicken Masala | black, 7.1 to 1 |
| 20 | `#c28e29` | `oklch(68.08% 0.1276 79.37)` | Arnica | black, 7.2 to 1 |
| 21 | `#b99535` | `oklch(68.55% 0.1195 88.04)` | Nugget | black, 7.4 to 1 |
| 22 | `#af9d42` | `oklch(69.33% 0.1123 97.75)` | Golden Olive | black, 7.7 to 1 |
| 23 | `#a7a44f` | `oklch(70.32% 0.1078 107.35)` | Desert Locust | black, 8 to 1 |
| 24 | `#9fac5b` | `oklch(71.64% 0.1075 116.65)` | Stay in Lime | black, 8.5 to 1 |
| 25 | `#97b667` | `oklch(73.43% 0.1107 126.53)` | Light Birch Green | black, 9.1 to 1 |
| 26 | `#8dc076` | `oklch(75.32% 0.1151 136.48)` | Grand Valley | black, 9.9 to 1 |
| 27 | `#80c885` | `oklch(76.92% 0.1189 145.93)` | Exhilarating Green | black, 10.5 to 1 |
| 28 | `#74ce94` | `oklch(77.89% 0.1200 154.53)` | Jocose Jade | black, 10.9 to 1 |
| 29 | `#67d0a2` | `oklch(78.31% 0.1192 163.04)` | Aquarium Blue | black, 11.1 to 1 |
| 30 | `#5dd1af` | `oklch(78.40% 0.1175 171.04)` | Simply Aqua | black, 11.1 to 1 |
| 31 | `#55d1b8` | `oklch(78.35% 0.1156 177.81)` | Sweet Garden | black, 11.1 to 1 |
| 32 | `#52d0bf` | `oklch(78.35% 0.1144 182.61)` | Peppy Peacock | black, 11.1 to 1 |

## CSS

```css
background: conic-gradient(from 135deg, #bdbb92 0.0%, #c2c08a 3.2%, #c9c67e 6.5%, #d1cd6d 9.7%, #d8d15c 12.9%, #ddd24d 16.1%, #e1cf42 19.4%, #e4cb39 22.6%, #e6c531 25.8%, #e8bf27 29.0%, #e9b61a 32.3%, #e8ac0e 35.5%, #e7a208 38.7%, #e49a0a 41.9%, #e0940f 45.2%, #db8e16 48.4%, #d68a1b 51.6%, #d0881f 54.8%, #ca8922 58.1%, #c28e29 61.3%, #b99535 64.5%, #af9d42 67.7%, #a7a44f 71.0%, #9fac5b 74.2%, #97b667 77.4%, #8dc076 80.6%, #80c885 83.9%, #74ce94 87.1%, #67d0a2 90.3%, #5dd1af 93.5%, #55d1b8 96.8%, #52d0bf 100.0%);
background: conic-gradient(from 135deg in oklch, oklch(78.35% 0.0551 105.47) 0.0%, oklch(79.52% 0.0708 105.72) 3.2%, oklch(81.27% 0.0937 106.18) 6.5%, oklch(83.06% 0.1182 106.41) 9.7%, oklch(84.37% 0.1386 105.97) 12.9%, oklch(84.77% 0.1503 104.50) 16.1%, oklch(84.56% 0.1559 102.16) 19.4%, oklch(83.90% 0.1578 99.20) 22.6%, oklch(82.91% 0.1581 95.83) 25.8%, oklch(81.70% 0.1586 92.26) 29.0%, oklch(80.08% 0.1590 87.91) 32.3%, oklch(78.08% 0.1585 82.97) 35.5%, oklch(75.99% 0.1571 78.24) 38.7%, oklch(74.09% 0.1550 74.53) 41.9%, oklch(72.49% 0.1523 72.04) 45.2%, oklch(70.93% 0.1489 69.92) 48.4%, oklch(69.54% 0.1448 68.85) 51.6%, oklch(68.52% 0.1401 69.59) 54.8%, oklch(68.03% 0.1348 72.92) 58.1%, oklch(68.08% 0.1276 79.37) 61.3%, oklch(68.55% 0.1195 88.04) 64.5%, oklch(69.33% 0.1123 97.75) 67.7%, oklch(70.32% 0.1078 107.35) 71.0%, oklch(71.64% 0.1075 116.65) 74.2%, oklch(73.43% 0.1107 126.53) 77.4%, oklch(75.32% 0.1151 136.48) 80.6%, oklch(76.92% 0.1189 145.93) 83.9%, oklch(77.89% 0.1200 154.53) 87.1%, oklch(78.31% 0.1192 163.04) 90.3%, oklch(78.40% 0.1175 171.04) 93.5%, oklch(78.35% 0.1156 177.81) 96.8%, oklch(78.35% 0.1144 182.61) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.783 | 0.055 | 105.5 |
| 2 | 0.846 | 0.145 | 105.5 |
| 3 | 0.819 | 0.158 | 92.8 |
| 4 | 0.736 | 0.154 | 73.8 |
| 5 | 0.681 | 0.136 | 71.7 |
| 6 | 0.705 | 0.107 | 108.6 |
| 7 | 0.776 | 0.12 | 150.9 |
| 8 | 0.783 | 0.114 | 182.6 |

## In these collections

- [Summer gradients](https://grabient.com/summer-gradients)

## Other forms

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