# Vivid duotone blue to light green linear gradient

Vivid duotone blue to light green linear gradient with 32 colors: #7c86ff, #798aff, #7590ff, #7197ff, #6c9eff, #69a4ff, #66aaff, #65b0ff, #64b7ff, #63bdff, #62c3ff, #62c9ff, #62d0ff, #63d6ff, #64dcfe, #64e2fd, #62e8f9, #60eff4, #61f5eb, #66fae0, #6ffdd5, #7affcb, #83ffc2, #84ffb9, #83ffaf, #85ffa5, #8afe9c, #91fe93, #98ff89, #a0ff80, #a7ff79, #abff72. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kaqoHFW7U9uQuPXtKrzc7M63M9vb0xr5A`
- Page: https://grabient.com/kaqoHFW7U9uQuPXtKrzc7M63M9vb0xr5A?steps=32
- Drawn as: linear gradient, 32 steps, 90 degrees
- Kinds: vivid, light, cool
- Hues: wide
- Contrast of its darkest and lightest colors: 2.5 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 | `#7c86ff` | `oklch(66.93% 0.1769 277.03)` | Orchid | black, 6.7 to 1 |
| 2 | `#798aff` | `oklch(67.57% 0.1719 274.58)` | Orchid | black, 6.9 to 1 |
| 3 | `#7590ff` | `oklch(68.47% 0.1656 271.15)` | Punch Out Glove | black, 7.2 to 1 |
| 4 | `#7197ff` | `oklch(69.53% 0.1589 267.11)` | Blue Chaos | black, 7.5 to 1 |
| 5 | `#6c9eff` | `oklch(70.68% 0.1527 262.82)` | Blue Chaos | black, 7.9 to 1 |
| 6 | `#69a4ff` | `oklch(71.86% 0.1469 258.66)` | Âbi Blue | black, 8.3 to 1 |
| 7 | `#66aaff` | `oklch(73.03% 0.1421 254.78)` | Âbi Blue | black, 8.7 to 1 |
| 8 | `#65b0ff` | `oklch(74.29% 0.1372 250.88)` | Tiān Lán Sky | black, 9.2 to 1 |
| 9 | `#64b7ff` | `oklch(75.60% 0.1326 246.89)` | Tiān Lán Sky | black, 9.7 to 1 |
| 10 | `#63bdff` | `oklch(76.95% 0.1284 242.75)` | Hello Summer | black, 10.2 to 1 |
| 11 | `#62c3ff` | `oklch(78.29% 0.1250 238.39)` | Maya Blue | black, 10.7 to 1 |
| 12 | `#62c9ff` | `oklch(79.65% 0.1224 233.84)` | Skyan | black, 11.3 to 1 |
| 13 | `#62d0ff` | `oklch(81.07% 0.1199 229.33)` | Skyan | black, 11.9 to 1 |
| 14 | `#63d6ff` | `oklch(82.50% 0.1183 224.64)` | Heisenberg Blue | black, 12.5 to 1 |
| 15 | `#64dcfe` | `oklch(83.90% 0.1172 219.52)` | Athena Blue | black, 13.2 to 1 |
| 16 | `#64e2fd` | `oklch(85.22% 0.1167 213.70)` | Athena Blue | black, 13.8 to 1 |
| 17 | `#62e8f9` | `oklch(86.42% 0.1181 206.83)` | Shimmering Expanse Cyan | black, 14.4 to 1 |
| 18 | `#60eff4` | `oklch(87.62% 0.1213 198.39)` | Poseidon Jr. | black, 15 to 1 |
| 19 | `#61f5eb` | `oklch(88.76% 0.1260 189.11)` | Poseidon Jr. | black, 15.7 to 1 |
| 20 | `#66fae0` | `oklch(89.77% 0.1314 179.90)` | Spindrift | black, 16.2 to 1 |
| 21 | `#6ffdd5` | `oklch(90.57% 0.1370 171.65)` | Spindrift | black, 16.7 to 1 |
| 22 | `#7affcb` | `oklch(91.07% 0.1400 165.21)` | Calamine Blue | black, 16.9 to 1 |
| 23 | `#83ffc2` | `oklch(91.19% 0.1418 160.37)` | Iridescent Turquoise | black, 17 to 1 |
| 24 | `#84ffb9` | `oklch(91.05% 0.1488 156.59)` | Mint Bliss | black, 16.9 to 1 |
| 25 | `#83ffaf` | `oklch(90.80% 0.1583 153.48)` | Foam Green | black, 16.8 to 1 |
| 26 | `#85ffa5` | `oklch(90.59% 0.1650 150.61)` | Baby Green | black, 16.7 to 1 |
| 27 | `#8afe9c` | `oklch(90.57% 0.1704 147.58)` | Baby Green | black, 16.7 to 1 |
| 28 | `#91fe93` | `oklch(90.73% 0.1759 144.38)` | Cobalt Green | black, 16.8 to 1 |
| 29 | `#98ff89` | `oklch(91.00% 0.1814 141.27)` | Cobalt Green | black, 16.9 to 1 |
| 30 | `#a0ff80` | `oklch(91.29% 0.1865 138.45)` | Lima | black, 17.1 to 1 |
| 31 | `#a7ff79` | `oklch(91.55% 0.1893 136.08)` | Key Lime | black, 17.2 to 1 |
| 32 | `#abff72` | `oklch(91.73% 0.1924 134.37)` | Key Lime | black, 17.2 to 1 |

## CSS

```css
background: linear-gradient(90deg, #7c86ff 0.0%, #798aff 3.2%, #7590ff 6.5%, #7197ff 9.7%, #6c9eff 12.9%, #69a4ff 16.1%, #66aaff 19.4%, #65b0ff 22.6%, #64b7ff 25.8%, #63bdff 29.0%, #62c3ff 32.3%, #62c9ff 35.5%, #62d0ff 38.7%, #63d6ff 41.9%, #64dcfe 45.2%, #64e2fd 48.4%, #62e8f9 51.6%, #60eff4 54.8%, #61f5eb 58.1%, #66fae0 61.3%, #6ffdd5 64.5%, #7affcb 67.7%, #83ffc2 71.0%, #84ffb9 74.2%, #83ffaf 77.4%, #85ffa5 80.6%, #8afe9c 83.9%, #91fe93 87.1%, #98ff89 90.3%, #a0ff80 93.5%, #a7ff79 96.8%, #abff72 100.0%);
background: linear-gradient(90deg in oklch, oklch(66.93% 0.1769 277.03) 0.0%, oklch(67.57% 0.1719 274.58) 3.2%, oklch(68.47% 0.1656 271.15) 6.5%, oklch(69.53% 0.1589 267.11) 9.7%, oklch(70.68% 0.1527 262.82) 12.9%, oklch(71.86% 0.1469 258.66) 16.1%, oklch(73.03% 0.1421 254.78) 19.4%, oklch(74.29% 0.1372 250.88) 22.6%, oklch(75.60% 0.1326 246.89) 25.8%, oklch(76.95% 0.1284 242.75) 29.0%, oklch(78.29% 0.1250 238.39) 32.3%, oklch(79.65% 0.1224 233.84) 35.5%, oklch(81.07% 0.1199 229.33) 38.7%, oklch(82.50% 0.1183 224.64) 41.9%, oklch(83.90% 0.1172 219.52) 45.2%, oklch(85.22% 0.1167 213.70) 48.4%, oklch(86.42% 0.1181 206.83) 51.6%, oklch(87.62% 0.1213 198.39) 54.8%, oklch(88.76% 0.1260 189.11) 58.1%, oklch(89.77% 0.1314 179.90) 61.3%, oklch(90.57% 0.1370 171.65) 64.5%, oklch(91.07% 0.1400 165.21) 67.7%, oklch(91.19% 0.1418 160.37) 71.0%, oklch(91.05% 0.1488 156.59) 74.2%, oklch(90.80% 0.1583 153.48) 77.4%, oklch(90.59% 0.1650 150.61) 80.6%, oklch(90.57% 0.1704 147.58) 83.9%, oklch(90.73% 0.1759 144.38) 87.1%, oklch(91.00% 0.1814 141.27) 90.3%, oklch(91.29% 0.1865 138.45) 93.5%, oklch(91.55% 0.1893 136.08) 96.8%, oklch(91.73% 0.1924 134.37) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.669 | 0.178 | 277 |
| 2 | 0.72 | 0.146 | 258 |
| 3 | 0.787 | 0.127 | 236.9 |
| 4 | 0.858 | 0.117 | 210.5 |
| 5 | 0.909 | 0.141 | 167.1 |
| 6 | 0.906 | 0.169 | 148.1 |
| 7 | 0.917 | 0.194 | 134.4 |

## In these collections

- [Blue and green gradients](https://grabient.com/blue-and-green-gradients)

## Other forms

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