# Vivid orange, yellow, green and teal linear swatches

Vivid orange, yellow, green and teal linear swatches with 32 colors: #ff7a24, #ff8224, #ff8c26, #ff9829, #ffa42e, #ffaf33, #ffba37, #ffc43a, #ffcb3b, #fed244, #ffd94c, #ffde56, #ffe35f, #ffe761, #fdeb61, #f9ed63, #f2ee64, #e8ee63, #dbec60, #cde95d, #bce65c, #aae25e, #97df63, #83dc6b, #6eda77, #56d886, #3cd495, #23d0a2, #0fccae, #10c7b6, #1dc3bc, #26bfbf. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kWuIcibbrEnY5QjnPsQXStGQ`
- Page: https://grabient.com/kWuIcibbrEnY5QjnPsQXStGQ?style=linearSwatches&steps=32&angle=165
- Drawn as: linear swatches, 32 steps, 165 degrees
- Kinds: vivid, light, multicolor
- Hues: wide
- Contrast of its darkest and lightest colors: 2.1 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 | `#ff7a24` | `oklch(72.44% 0.1847 47.81)` | Royal Oranje | black, 8 to 1 |
| 2 | `#ff8224` | `oklch(73.59% 0.1794 51.09)` | Fluorescent Red Orange | black, 8.4 to 1 |
| 3 | `#ff8c26` | `oklch(75.19% 0.1730 55.62)` | Instant Orange | black, 9 to 1 |
| 4 | `#ff9829` | `oklch(77.10% 0.1668 61.03)` | Guava | black, 9.7 to 1 |
| 5 | `#ffa42e` | `oklch(79.18% 0.1617 66.93)` | Tamago Orange | black, 10.5 to 1 |
| 6 | `#ffaf33` | `oklch(81.29% 0.1585 72.94)` | Ripe Pumpkin | black, 11.4 to 1 |
| 7 | `#ffba37` | `oklch(83.32% 0.1574 78.67)` | Buddha’s Love Handles | black, 12.3 to 1 |
| 8 | `#ffc43a` | `oklch(85.11% 0.1585 83.76)` | Bright Bubble | black, 13.1 to 1 |
| 9 | `#ffcb3b` | `oklch(86.55% 0.1608 87.82)` | Yellow Jacket | black, 13.8 to 1 |
| 10 | `#fed244` | `oklch(87.90% 0.1592 90.95)` | Lamplight | black, 14.5 to 1 |
| 11 | `#ffd94c` | `oklch(89.24% 0.1579 93.43)` | Tuscan Sun | black, 15.2 to 1 |
| 12 | `#ffde56` | `oklch(90.47% 0.1548 95.50)` | Pickled Ginger | black, 15.8 to 1 |
| 13 | `#ffe35f` | `oklch(91.54% 0.1518 97.39)` | Fried Egg | black, 16.4 to 1 |
| 14 | `#ffe761` | `oklch(92.37% 0.1539 99.34)` | Fried Egg | black, 16.8 to 1 |
| 15 | `#fdeb61` | `oklch(92.89% 0.1564 101.56)` | Maizena | black, 17.1 to 1 |
| 16 | `#f9ed63` | `oklch(93.02% 0.1568 104.30)` | Yellowish | black, 17.3 to 1 |
| 17 | `#f2ee64` | `oklch(92.67% 0.1577 107.70)` | Crash Dummy | black, 17.1 to 1 |
| 18 | `#e8ee63` | `oklch(91.73% 0.1598 111.40)` | Honeysuckle | black, 16.7 to 1 |
| 19 | `#dbec60` | `oklch(90.33% 0.1630 115.34)` | Mindaro | black, 16.1 to 1 |
| 20 | `#cde95d` | `oklch(88.62% 0.1665 119.54)` | Maximum Green Yellow | black, 15.3 to 1 |
| 21 | `#bce65c` | `oklch(86.72% 0.1698 124.03)` | Inchworm | black, 14.5 to 1 |
| 22 | `#aae25e` | `oklch(84.80% 0.1723 128.82)` | Conifer | black, 13.7 to 1 |
| 23 | `#97df63` | `oklch(82.99% 0.1735 133.93)` | Last of Lettuce | black, 13 to 1 |
| 24 | `#83dc6b` | `oklch(81.43% 0.1728 139.39)` | Pastel Green | black, 12.4 to 1 |
| 25 | `#6eda77` | `oklch(80.15% 0.1695 145.50)` | Pastel Green | black, 11.9 to 1 |
| 26 | `#56d886` | `oklch(78.90% 0.1637 152.75)` | Drunken Dragonfly | black, 11.5 to 1 |
| 27 | `#3cd495` | `oklch(77.70% 0.1561 160.71)` | Envy’s Love | black, 11 to 1 |
| 28 | `#23d0a2` | `oklch(76.56% 0.1474 168.91)` | Wild Caribbean Green | black, 10.6 to 1 |
| 29 | `#0fccae` | `oklch(75.52% 0.1386 176.88)` | Mint Leaf | black, 10.2 to 1 |
| 30 | `#10c7b6` | `oklch(74.60% 0.1303 184.15)` | Amazonite | black, 9.8 to 1 |
| 31 | `#1dc3bc` | `oklch(73.83% 0.1233 190.25)` | Swimmers Pool | black, 9.5 to 1 |
| 32 | `#26bfbf` | `oklch(73.23% 0.1185 194.70)` | Maximum Blue Green | black, 9.3 to 1 |

## CSS

```css
background: linear-gradient(165deg, #ff7a24 0.000% 3.125%, #ff8224 3.125% 6.250%, #ff8c26 6.250% 9.375%, #ff9829 9.375% 12.500%, #ffa42e 12.500% 15.625%, #ffaf33 15.625% 18.750%, #ffba37 18.750% 21.875%, #ffc43a 21.875% 25.000%, #ffcb3b 25.000% 28.125%, #fed244 28.125% 31.250%, #ffd94c 31.250% 34.375%, #ffde56 34.375% 37.500%, #ffe35f 37.500% 40.625%, #ffe761 40.625% 43.750%, #fdeb61 43.750% 46.875%, #f9ed63 46.875% 50.000%, #f2ee64 50.000% 53.125%, #e8ee63 53.125% 56.250%, #dbec60 56.250% 59.375%, #cde95d 59.375% 62.500%, #bce65c 62.500% 65.625%, #aae25e 65.625% 68.750%, #97df63 68.750% 71.875%, #83dc6b 71.875% 75.000%, #6eda77 75.000% 78.125%, #56d886 78.125% 81.250%, #3cd495 81.250% 84.375%, #23d0a2 84.375% 87.500%, #0fccae 87.500% 90.625%, #10c7b6 90.625% 93.750%, #1dc3bc 93.750% 96.875%, #26bfbf 96.875% 100.000%);
background: linear-gradient(165deg, oklch(72.44% 0.1847 47.81) 0.000% 3.125%, oklch(73.59% 0.1794 51.09) 3.125% 6.250%, oklch(75.19% 0.1730 55.62) 6.250% 9.375%, oklch(77.10% 0.1668 61.03) 9.375% 12.500%, oklch(79.18% 0.1617 66.93) 12.500% 15.625%, oklch(81.29% 0.1585 72.94) 15.625% 18.750%, oklch(83.32% 0.1574 78.67) 18.750% 21.875%, oklch(85.11% 0.1585 83.76) 21.875% 25.000%, oklch(86.55% 0.1608 87.82) 25.000% 28.125%, oklch(87.90% 0.1592 90.95) 28.125% 31.250%, oklch(89.24% 0.1579 93.43) 31.250% 34.375%, oklch(90.47% 0.1548 95.50) 34.375% 37.500%, oklch(91.54% 0.1518 97.39) 37.500% 40.625%, oklch(92.37% 0.1539 99.34) 40.625% 43.750%, oklch(92.89% 0.1564 101.56) 43.750% 46.875%, oklch(93.02% 0.1568 104.30) 46.875% 50.000%, oklch(92.67% 0.1577 107.70) 50.000% 53.125%, oklch(91.73% 0.1598 111.40) 53.125% 56.250%, oklch(90.33% 0.1630 115.34) 56.250% 59.375%, oklch(88.62% 0.1665 119.54) 59.375% 62.500%, oklch(86.72% 0.1698 124.03) 62.500% 65.625%, oklch(84.80% 0.1723 128.82) 65.625% 68.750%, oklch(82.99% 0.1735 133.93) 68.750% 71.875%, oklch(81.43% 0.1728 139.39) 71.875% 75.000%, oklch(80.15% 0.1695 145.50) 75.000% 78.125%, oklch(78.90% 0.1637 152.75) 78.125% 81.250%, oklch(77.70% 0.1561 160.71) 81.250% 84.375%, oklch(76.56% 0.1474 168.91) 84.375% 87.500%, oklch(75.52% 0.1386 176.88) 87.500% 90.625%, oklch(74.60% 0.1303 184.15) 90.625% 93.750%, oklch(73.83% 0.1233 190.25) 93.750% 96.875%, oklch(73.23% 0.1185 194.70) 96.875% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.724 | 0.186 | 47.8 |
| 2 | 0.862 | 0.161 | 86.9 |
| 3 | 0.929 | 0.157 | 105.9 |
| 4 | 0.811 | 0.172 | 140.8 |
| 5 | 0.732 | 0.119 | 194.7 |

## In these collections

- [Bright gradients](https://grabient.com/bright-gradients)
- [Green gradients](https://grabient.com/green-gradients)

## Other forms

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