# Vivid analogous yellow to orange linear gradient

Vivid analogous yellow to orange linear gradient with 32 colors: #ffee82, #ffed81, #ffed80, #ffec7e, #ffec7d, #ffeb7c, #ffea7a, #ffe978, #ffe775, #ffe572, #ffe26e, #ffdf6a, #ffdc65, #ffd75e, #ffd358, #ffce50, #ffc848, #ffc340, #ffbd39, #ffb732, #ffb129, #ffab20, #ffa417, #ff9c0e, #ff9304, #ff8a00, #ff8100, #ff7800, #ff6e00, #ff6506, #fe5e12, #fd5919. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kU72BH9DS_Wa7vVWTLvA`
- Page: https://grabient.com/kU72BH9DS_Wa7vVWTLvA?steps=32&angle=0
- Drawn as: linear gradient, 32 steps, 0 degrees
- Kinds: vivid, light, warm
- Hues: analogous
- Contrast of its darkest and lightest colors: 2.6 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 | `#ffee82` | `oklch(94.09% 0.1307 100.55)` | Lemon Peel | black, 17.8 to 1 |
| 2 | `#ffed81` | `oklch(93.97% 0.1312 100.32)` | Lemon Peel | black, 17.7 to 1 |
| 3 | `#ffed80` | `oklch(93.85% 0.1318 100.12)` | Lemon Peel | black, 17.6 to 1 |
| 4 | `#ffec7e` | `oklch(93.73% 0.1324 99.91)` | Digital Yellow | black, 17.6 to 1 |
| 5 | `#ffec7d` | `oklch(93.59% 0.1331 99.67)` | Digital Yellow | black, 17.5 to 1 |
| 6 | `#ffeb7c` | `oklch(93.41% 0.1339 99.36)` | Digital Yellow | black, 17.4 to 1 |
| 7 | `#ffea7a` | `oklch(93.19% 0.1348 98.95)` | Digital Yellow | black, 17.3 to 1 |
| 8 | `#ffe978` | `oklch(92.91% 0.1357 98.41)` | Banana Peel | black, 17.1 to 1 |
| 9 | `#ffe775` | `oklch(92.55% 0.1366 97.71)` | Banana Peel | black, 16.9 to 1 |
| 10 | `#ffe572` | `oklch(92.10% 0.1377 96.82)` | Shandy | black, 16.7 to 1 |
| 11 | `#ffe26e` | `oklch(91.55% 0.1388 95.70)` | Dynamic Yellow | black, 16.4 to 1 |
| 12 | `#ffdf6a` | `oklch(90.88% 0.1402 94.34)` | Pale Gold | black, 16 to 1 |
| 13 | `#ffdc65` | `oklch(90.10% 0.1421 92.79)` | Lemon Tart | black, 15.6 to 1 |
| 14 | `#ffd75e` | `oklch(89.21% 0.1443 91.06)` | Common Dandelion | black, 15.1 to 1 |
| 15 | `#ffd358` | `oklch(88.24% 0.1468 89.16)` | Glowing Reviews | black, 14.6 to 1 |
| 16 | `#ffce50` | `oklch(87.20% 0.1495 87.10)` | Canary Diamond | black, 14.1 to 1 |
| 17 | `#ffc848` | `oklch(86.11% 0.1522 84.90)` | Chunky Bee | black, 13.6 to 1 |
| 18 | `#ffc340` | `oklch(84.97% 0.1548 82.57)` | Golden Promise | black, 13.1 to 1 |
| 19 | `#ffbd39` | `oklch(83.81% 0.1569 80.12)` | Fall Gold | black, 12.5 to 1 |
| 20 | `#ffb732` | `oklch(82.64% 0.1592 77.55)` | Soft Boiled | black, 12 to 1 |
| 21 | `#ffb129` | `oklch(81.48% 0.1619 74.89)` | Golden Treasure | black, 11.5 to 1 |
| 22 | `#ffab20` | `oklch(80.32% 0.1651 72.12)` | Averland Sunset | black, 11 to 1 |
| 23 | `#ffa417` | `oklch(79.05% 0.1681 68.94)` | Pico Orange | black, 10.5 to 1 |
| 24 | `#ff9c0e` | `oklch(77.68% 0.1714 65.37)` | Clementine Earring | black, 9.9 to 1 |
| 25 | `#ff9304` | `oklch(76.23% 0.1755 61.53)` | Tangerine | black, 9.4 to 1 |
| 26 | `#ff8a00` | `oklch(74.76% 0.1798 57.55)` | American Orange | black, 8.8 to 1 |
| 27 | `#ff8100` | `oklch(73.31% 0.1847 53.58)` | Oriole | black, 8.3 to 1 |
| 28 | `#ff7800` | `oklch(71.91% 0.1909 49.73)` | Lucky Orange | black, 7.9 to 1 |
| 29 | `#ff6e00` | `oklch(70.61% 0.1981 46.14)` | Flush Orange | black, 7.4 to 1 |
| 30 | `#ff6506` | `oklch(69.45% 0.2043 42.94)` | Safety Orange | black, 7.1 to 1 |
| 31 | `#fe5e12` | `oklch(68.47% 0.2080 40.25)` | Maximum Orange | black, 6.8 to 1 |
| 32 | `#fd5919` | `oklch(67.72% 0.2108 38.20)` | Carrot Lava | black, 6.6 to 1 |

## CSS

```css
background: linear-gradient(0deg, #ffee82 0.0%, #ffed81 3.2%, #ffed80 6.5%, #ffec7e 9.7%, #ffec7d 12.9%, #ffeb7c 16.1%, #ffea7a 19.4%, #ffe978 22.6%, #ffe775 25.8%, #ffe572 29.0%, #ffe26e 32.3%, #ffdf6a 35.5%, #ffdc65 38.7%, #ffd75e 41.9%, #ffd358 45.2%, #ffce50 48.4%, #ffc848 51.6%, #ffc340 54.8%, #ffbd39 58.1%, #ffb732 61.3%, #ffb129 64.5%, #ffab20 67.7%, #ffa417 71.0%, #ff9c0e 74.2%, #ff9304 77.4%, #ff8a00 80.6%, #ff8100 83.9%, #ff7800 87.1%, #ff6e00 90.3%, #ff6506 93.5%, #fe5e12 96.8%, #fd5919 100.0%);
background: linear-gradient(0deg in oklch, oklch(94.09% 0.1307 100.55) 0.0%, oklch(93.97% 0.1312 100.32) 3.2%, oklch(93.85% 0.1318 100.12) 6.5%, oklch(93.73% 0.1324 99.91) 9.7%, oklch(93.59% 0.1331 99.67) 12.9%, oklch(93.41% 0.1339 99.36) 16.1%, oklch(93.19% 0.1348 98.95) 19.4%, oklch(92.91% 0.1357 98.41) 22.6%, oklch(92.55% 0.1366 97.71) 25.8%, oklch(92.10% 0.1377 96.82) 29.0%, oklch(91.55% 0.1388 95.70) 32.3%, oklch(90.88% 0.1402 94.34) 35.5%, oklch(90.10% 0.1421 92.79) 38.7%, oklch(89.21% 0.1443 91.06) 41.9%, oklch(88.24% 0.1468 89.16) 45.2%, oklch(87.20% 0.1495 87.10) 48.4%, oklch(86.11% 0.1522 84.90) 51.6%, oklch(84.97% 0.1548 82.57) 54.8%, oklch(83.81% 0.1569 80.12) 58.1%, oklch(82.64% 0.1592 77.55) 61.3%, oklch(81.48% 0.1619 74.89) 64.5%, oklch(80.32% 0.1651 72.12) 67.7%, oklch(79.05% 0.1681 68.94) 71.0%, oklch(77.68% 0.1714 65.37) 74.2%, oklch(76.23% 0.1755 61.53) 77.4%, oklch(74.76% 0.1798 57.55) 80.6%, oklch(73.31% 0.1847 53.58) 83.9%, oklch(71.91% 0.1909 49.73) 87.1%, oklch(70.61% 0.1981 46.14) 90.3%, oklch(69.45% 0.2043 42.94) 93.5%, oklch(68.47% 0.2080 40.25) 96.8%, oklch(67.72% 0.2108 38.20) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.941 | 0.132 | 100.5 |
| 2 | 0.913 | 0.145 | 95.3 |
| 3 | 0.807 | 0.164 | 73.1 |
| 4 | 0.677 | 0.211 | 38.2 |

## In these collections

- [Orange gradients](https://grabient.com/orange-gradients)

## Other forms

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