# Vivid beige, yellow and orange radial gradient

Vivid beige, yellow and orange radial gradient with 32 colors: #ffeba5, #ffeaa3, #ffe9a0, #ffe89c, #ffe698, #ffe594, #ffe390, #ffe18b, #ffdf86, #ffdd81, #ffdb7c, #ffd977, #ffd772, #ffd56e, #ffd369, #ffd165, #ffcf62, #ffcd5e, #ffcb5b, #ffc958, #ffc755, #ffc551, #ffc34e, #ffc14b, #ffbf49, #ffbd46, #ffbc43, #ffba41, #ffb83f, #ffb73d, #ffb63b, #ffb539. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kS70NDb7G--i4vq`
- Page: https://grabient.com/kS70NDb7G--i4vq?style=radialGradient&steps=32&angle=315
- Drawn as: radial gradient, 32 steps, 315 degrees
- Kinds: even lightness, vivid, light, warm
- Hues: monochromatic
- Contrast of its darkest and lightest colors: 1.4 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 | `#ffeba5` | `oklch(94.09% 0.0905 94.23)` | Rite of Spring | black, 17.7 to 1 |
| 2 | `#ffeaa3` | `oklch(93.86% 0.0926 93.92)` | Butter Tart | black, 17.5 to 1 |
| 3 | `#ffe9a0` | `oklch(93.58% 0.0952 93.56)` | Butter Tart | black, 17.4 to 1 |
| 4 | `#ffe89c` | `oklch(93.26% 0.0981 93.15)` | First Tulip | black, 17.2 to 1 |
| 5 | `#ffe698` | `oklch(92.90% 0.1012 92.69)` | Chilled Lemonade | black, 17 to 1 |
| 6 | `#ffe594` | `oklch(92.50% 0.1042 92.19)` | Chilled Lemonade | black, 16.8 to 1 |
| 7 | `#ffe390` | `oklch(92.08% 0.1073 91.66)` | Banana Republic | black, 16.6 to 1 |
| 8 | `#ffe18b` | `oklch(91.63% 0.1106 91.09)` | Sweet Chamomile | black, 16.3 to 1 |
| 9 | `#ffdf86` | `oklch(91.17% 0.1140 90.50)` | Yellow Corn | black, 16.1 to 1 |
| 10 | `#ffdd81` | `oklch(90.70% 0.1174 89.89)` | Spirited Yellow | black, 15.9 to 1 |
| 11 | `#ffdb7c` | `oklch(90.23% 0.1208 89.26)` | Sunlit | black, 15.6 to 1 |
| 12 | `#ffd977` | `oklch(89.75% 0.1241 88.63)` | Spiced Butternut | black, 15.4 to 1 |
| 13 | `#ffd772` | `oklch(89.29% 0.1273 87.98)` | Honey Glaze | black, 15.1 to 1 |
| 14 | `#ffd56e` | `oklch(88.84% 0.1302 87.34)` | Quiche Lorraine | black, 14.9 to 1 |
| 15 | `#ffd369` | `oklch(88.40% 0.1329 86.70)` | Bright Halo | black, 14.7 to 1 |
| 16 | `#ffd165` | `oklch(87.99% 0.1353 86.08)` | Bright Halo | black, 14.5 to 1 |
| 17 | `#ffcf62` | `oklch(87.60% 0.1372 85.46)` | Golden Moray Eel | black, 14.3 to 1 |
| 18 | `#ffcd5e` | `oklch(87.21% 0.1390 84.79)` | Golden Moray Eel | black, 14.1 to 1 |
| 19 | `#ffcb5b` | `oklch(86.80% 0.1407 84.07)` | Nacho | black, 13.9 to 1 |
| 20 | `#ffc958` | `oklch(86.39% 0.1422 83.32)` | Nacho | black, 13.7 to 1 |
| 21 | `#ffc755` | `oklch(85.97% 0.1438 82.54)` | Golden Promise | black, 13.5 to 1 |
| 22 | `#ffc551` | `oklch(85.56% 0.1452 81.75)` | Golden Promise | black, 13.3 to 1 |
| 23 | `#ffc34e` | `oklch(85.15% 0.1466 80.95)` | Nârenji Orange | black, 13.1 to 1 |
| 24 | `#ffc14b` | `oklch(84.74% 0.1479 80.15)` | Nârenji Orange | black, 12.9 to 1 |
| 25 | `#ffbf49` | `oklch(84.35% 0.1492 79.37)` | Twenty Carat | black, 12.8 to 1 |
| 26 | `#ffbd46` | `oklch(83.98% 0.1503 78.62)` | Twenty Carat | black, 12.6 to 1 |
| 27 | `#ffbc43` | `oklch(83.62% 0.1515 77.90)` | Pale Marigold | black, 12.4 to 1 |
| 28 | `#ffba41` | `oklch(83.29% 0.1525 77.23)` | Pale Marigold | black, 12.3 to 1 |
| 29 | `#ffb83f` | `oklch(82.99% 0.1535 76.61)` | Soft Boiled | black, 12.2 to 1 |
| 30 | `#ffb73d` | `oklch(82.72% 0.1543 76.06)` | Soft Boiled | black, 12 to 1 |
| 31 | `#ffb63b` | `oklch(82.48% 0.1551 75.58)` | Soft Boiled | black, 11.9 to 1 |
| 32 | `#ffb539` | `oklch(82.28% 0.1557 75.20)` | Corona | black, 11.8 to 1 |

## CSS

```css
background: radial-gradient(circle at 50% 50%, #ffeba5 0.0%, #ffeaa3 3.2%, #ffe9a0 6.5%, #ffe89c 9.7%, #ffe698 12.9%, #ffe594 16.1%, #ffe390 19.4%, #ffe18b 22.6%, #ffdf86 25.8%, #ffdd81 29.0%, #ffdb7c 32.3%, #ffd977 35.5%, #ffd772 38.7%, #ffd56e 41.9%, #ffd369 45.2%, #ffd165 48.4%, #ffcf62 51.6%, #ffcd5e 54.8%, #ffcb5b 58.1%, #ffc958 61.3%, #ffc755 64.5%, #ffc551 67.7%, #ffc34e 71.0%, #ffc14b 74.2%, #ffbf49 77.4%, #ffbd46 80.6%, #ffbc43 83.9%, #ffba41 87.1%, #ffb83f 90.3%, #ffb73d 93.5%, #ffb63b 96.8%, #ffb539 100.0%);
background: radial-gradient(circle at 50% 50% in oklch, oklch(94.09% 0.0905 94.23) 0.0%, oklch(93.86% 0.0926 93.92) 3.2%, oklch(93.58% 0.0952 93.56) 6.5%, oklch(93.26% 0.0981 93.15) 9.7%, oklch(92.90% 0.1012 92.69) 12.9%, oklch(92.50% 0.1042 92.19) 16.1%, oklch(92.08% 0.1073 91.66) 19.4%, oklch(91.63% 0.1106 91.09) 22.6%, oklch(91.17% 0.1140 90.50) 25.8%, oklch(90.70% 0.1174 89.89) 29.0%, oklch(90.23% 0.1208 89.26) 32.3%, oklch(89.75% 0.1241 88.63) 35.5%, oklch(89.29% 0.1273 87.98) 38.7%, oklch(88.84% 0.1302 87.34) 41.9%, oklch(88.40% 0.1329 86.70) 45.2%, oklch(87.99% 0.1353 86.08) 48.4%, oklch(87.60% 0.1372 85.46) 51.6%, oklch(87.21% 0.1390 84.79) 54.8%, oklch(86.80% 0.1407 84.07) 58.1%, oklch(86.39% 0.1422 83.32) 61.3%, oklch(85.97% 0.1438 82.54) 64.5%, oklch(85.56% 0.1452 81.75) 67.7%, oklch(85.15% 0.1466 80.95) 71.0%, oklch(84.74% 0.1479 80.15) 74.2%, oklch(84.35% 0.1492 79.37) 77.4%, oklch(83.98% 0.1503 78.62) 80.6%, oklch(83.62% 0.1515 77.90) 83.9%, oklch(83.29% 0.1525 77.23) 87.1%, oklch(82.99% 0.1535 76.61) 90.3%, oklch(82.72% 0.1543 76.06) 93.5%, oklch(82.48% 0.1551 75.58) 96.8%, oklch(82.28% 0.1557 75.20) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.941 | 0.092 | 94.2 |
| 2 | 0.878 | 0.136 | 85.8 |
| 3 | 0.823 | 0.156 | 75.2 |

## In these collections

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

## Other forms

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