# Periwinkle yellow lime glow

Neon yellow to light blue linear gradient with 8 colors: #b1de00, #d4ef00, #e8fd03, #f5ff22, #f0f947, #dfeab0, #cbd3f0, #acb4ff. Edit it and copy or download CSS, SVG, PNG or shader code.

- Also called: Neon yellow to light blue linear gradient
- Seed: `kc1ZZX8sy_XhOP76S7-eES__QbwHuj1J5K3Ao`
- Page: https://grabient.com/kc1ZZX8sy_XhOP76S7-eES__QbwHuj1J5K3Ao?steps=8&angle=0
- Drawn as: linear gradient, 8 steps, 0 degrees
- Kinds: vivid, neon, light
- Hues: monochromatic
- Contrast of its darkest and lightest colors: 1.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 | `#b1de00` | `oklch(83.86% 0.2059 123.05)` | Yellowish Green | black, 13.3 to 1 |
| 2 | `#d4ef00` | `oklch(90.16% 0.2094 117.76)` | Spleen Green | black, 16.1 to 1 |
| 3 | `#e8fd03` | `oklch(94.49% 0.2150 115.65)` | Spoiled Egg | black, 18.4 to 1 |
| 4 | `#f5ff22` | `oklch(96.06% 0.2081 112.48)` | Aromatic Lemon | black, 19.2 to 1 |
| 5 | `#f0f947` | `oklch(94.49% 0.1888 112.48)` | Banana Bandanna | black, 18.3 to 1 |
| 6 | `#dfeab0` | `oklch(91.34% 0.0758 116.71)` | Fresh Up | black, 16.4 to 1 |
| 7 | `#cbd3f0` | `oklch(87.01% 0.0413 273.11)` | Frozen Periwinkle | black, 14.1 to 1 |
| 8 | `#acb4ff` | `oklch(79.13% 0.1071 279.45)` | Winterspring Lilac | black, 10.7 to 1 |

## CSS

```css
background: linear-gradient(0deg, #b1de00 0.0%, #d4ef00 14.3%, #e8fd03 28.6%, #f5ff22 42.9%, #f0f947 57.1%, #dfeab0 71.4%, #cbd3f0 85.7%, #acb4ff 100.0%);
background: linear-gradient(0deg in oklch, oklch(83.86% 0.2059 123.05) 0.0%, oklch(90.16% 0.2094 117.76) 14.3%, oklch(94.49% 0.2150 115.65) 28.6%, oklch(96.06% 0.2081 112.48) 42.9%, oklch(94.49% 0.1888 112.48) 57.1%, oklch(91.34% 0.0758 116.71) 71.4%, oklch(87.01% 0.0413 273.11) 85.7%, oklch(79.13% 0.1071 279.45) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.839 | 0.207 | 123 |
| 2 | 0.902 | 0.211 | 117.8 |
| 3 | 0.945 | 0.215 | 115.6 |
| 4 | 0.961 | 0.208 | 112.5 |
| 5 | 0.945 | 0.189 | 112.5 |
| 6 | 0.913 | 0.076 | 116.7 |
| 7 | 0.87 | 0.041 | 273.1 |
| 8 | 0.791 | 0.125 | 279.4 |

## In these collections

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

## Other forms

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