# Gummy Candy Twilight

5 diagonal bands follow orange, green, blue, violet, and deep violet. The lighter colors offer relief while the deeper colors support legible pale type and clear focal marks. Use this palette for candy packaging, party graphics, playful stickers, and bright interface accents; each visible color keeps a practical role without weakening the collection’s specific mood.

- Also called: Orange, teal, blue and purple linear swatches
- Seed: `kW0WkzXrBLtGyylOQMUrCFAg`
- Page: https://grabient.com/kW0WkzXrBLtGyylOQMUrCFAg?style=linearSwatches&steps=5&angle=135
- Drawn as: linear swatches, 5 steps, 135 degrees
- Kinds: light to dark, vivid
- Hues: two-hue
- Contrast of its darkest and lightest colors: 6.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 | `#ffb44d` | `oklch(82.28% 0.1447 71.72)` | Koromiko | black, 11.8 to 1 |
| 2 | `#35c7a1` | `oklch(74.41% 0.1323 171.05)` | Jadeite | black, 9.8 to 1 |
| 3 | `#568ce0` | `oklch(64.17% 0.1392 258.76)` | Blue Jay | black, 6.2 to 1 |
| 4 | `#9b63da` | `oklch(61.42% 0.1778 303.15)` | Legendary Lavender | black, 5.2 to 1 |
| 5 | `#472a5d` | `oklch(34.65% 0.0909 308.43)` | Acai | white, 11.9 to 1 |

## CSS

```css
background: linear-gradient(135deg, #ffb44d 0.000% 20.000%, #35c7a1 20.000% 40.000%, #568ce0 40.000% 60.000%, #9b63da 60.000% 80.000%, #472a5d 80.000% 100.000%);
background: linear-gradient(135deg, oklch(82.28% 0.1447 71.72) 0.000% 20.000%, oklch(74.41% 0.1323 171.05) 20.000% 40.000%, oklch(64.17% 0.1392 258.76) 40.000% 60.000%, oklch(61.42% 0.1778 303.15) 60.000% 80.000%, oklch(34.65% 0.0909 308.43) 80.000% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.823 | 0.145 | 71.7 |
| 2 | 0.744 | 0.132 | 171.1 |
| 3 | 0.642 | 0.139 | 258.8 |
| 4 | 0.614 | 0.178 | 303.1 |
| 5 | 0.346 | 0.091 | 308.4 |

## In these collections

- [Gummy candy swatches](https://grabient.com/gummy-candy-swatches)

## Other forms

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