# Vivid duotone blue to green linear gradient

Vivid duotone blue to green linear gradient with 32 colors: #63a7ed, #5fa9e8, #5dace1, #5eaed9, #60b0d0, #63b1c8, #64b3c1, #62b4ba, #60b5b2, #5eb6a8, #5eb79d, #61b790, #65b783, #69b778, #6ab76c, #69b760, #67b754, #65b747, #64b63b, #64b52d, #65b321, #65b216, #64b00d, #63ae06, #63ac01, #62aa00, #62a700, #62a500, #61a200, #609f03, #5f9d07, #5f9c0a. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kYtVqyW507FqpuTYwj4VMS_k--P8`
- Page: https://grabient.com/kYtVqyW507FqpuTYwj4VMS_k--P8?steps=32
- Drawn as: linear gradient, 32 steps, 90 degrees
- Kinds: even lightness, vivid
- Hues: two-hue
- 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 | `#63a7ed` | `oklch(71.26% 0.1240 250.31)` | Cerulean | black, 8.2 to 1 |
| 2 | `#5fa9e8` | `oklch(71.36% 0.1185 246.18)` | Blue Jeans | black, 8.3 to 1 |
| 3 | `#5dace1` | `oklch(71.51% 0.1103 240.63)` | Acapulco Dive | black, 8.4 to 1 |
| 4 | `#5eaed9` | `oklch(71.69% 0.1008 233.98)` | Salem Blue | black, 8.5 to 1 |
| 5 | `#60b0d0` | `oklch(71.85% 0.0916 226.57)` | Crystal Seas | black, 8.6 to 1 |
| 6 | `#63b1c8` | `oklch(71.98% 0.0842 218.70)` | Gondolier | black, 8.6 to 1 |
| 7 | `#64b3c1` | `oklch(72.05% 0.0802 210.69)` | Glacier Lake | black, 8.7 to 1 |
| 8 | `#62b4ba` | `oklch(72.03% 0.0803 202.21)` | Aqueduct | black, 8.7 to 1 |
| 9 | `#60b5b2` | `oklch(71.96% 0.0832 192.46)` | Veranda Blue | black, 8.7 to 1 |
| 10 | `#5eb6a8` | `oklch(71.84% 0.0883 182.10)` | Tropic Turquoise | black, 8.7 to 1 |
| 11 | `#5eb79d` | `oklch(71.69% 0.0950 171.86)` | Keppel | black, 8.7 to 1 |
| 12 | `#61b790` | `oklch(71.52% 0.1028 162.44)` | Crazy Eyes | black, 8.7 to 1 |
| 13 | `#65b783` | `oklch(71.34% 0.1111 154.58)` | Green Garter | black, 8.6 to 1 |
| 14 | `#69b778` | `oklch(71.15% 0.1199 148.82)` | Appleton | black, 8.6 to 1 |
| 15 | `#6ab76c` | `oklch(70.95% 0.1309 144.70)` | Forest Fern | black, 8.5 to 1 |
| 16 | `#69b760` | `oklch(70.74% 0.1434 141.83)` | Palm Tree | black, 8.5 to 1 |
| 17 | `#67b754` | `oklch(70.50% 0.1562 139.83)` | Pure Apple | black, 8.4 to 1 |
| 18 | `#65b747` | `oklch(70.22% 0.1680 138.36)` | Pure Apple | black, 8.3 to 1 |
| 19 | `#64b63b` | `oklch(69.90% 0.1776 137.04)` | Skirret Green | black, 8.3 to 1 |
| 20 | `#64b52d` | `oklch(69.53% 0.1841 135.62)` | Chasm Green | black, 8.1 to 1 |
| 21 | `#65b321` | `oklch(69.10% 0.1880 134.57)` | Chasm Green | black, 8 to 1 |
| 22 | `#65b216` | `oklch(68.62% 0.1901 133.94)` | Extra Life | black, 7.9 to 1 |
| 23 | `#64b00d` | `oklch(68.10% 0.1907 133.59)` | Kermit Green | black, 7.7 to 1 |
| 24 | `#63ae06` | `oklch(67.55% 0.1904 133.40)` | Appetising Asparagus | black, 7.5 to 1 |
| 25 | `#63ac01` | `oklch(66.99% 0.1895 133.23)` | Appetising Asparagus | black, 7.4 to 1 |
| 26 | `#62aa00` | `oklch(66.42% 0.1873 132.95)` | Appetising Asparagus | black, 7.2 to 1 |
| 27 | `#62a700` | `oklch(65.76% 0.1846 132.67)` | Ruminant’s Paradise | black, 7 to 1 |
| 28 | `#62a500` | `oklch(65.04% 0.1819 132.45)` | Ruminant’s Paradise | black, 6.8 to 1 |
| 29 | `#61a200` | `oklch(64.30% 0.1793 132.28)` | Prairie Green | black, 6.6 to 1 |
| 30 | `#609f03` | `oklch(63.60% 0.1762 132.14)` | Gecko’s Dream | black, 6.4 to 1 |
| 31 | `#5f9d07` | `oklch(63.02% 0.1730 132.04)` | Gecko’s Dream | black, 6.3 to 1 |
| 32 | `#5f9c0a` | `oklch(62.60% 0.1709 131.96)` | Gecko’s Dream | black, 6.2 to 1 |

## CSS

```css
background: linear-gradient(90deg, #63a7ed 0.0%, #5fa9e8 3.2%, #5dace1 6.5%, #5eaed9 9.7%, #60b0d0 12.9%, #63b1c8 16.1%, #64b3c1 19.4%, #62b4ba 22.6%, #60b5b2 25.8%, #5eb6a8 29.0%, #5eb79d 32.3%, #61b790 35.5%, #65b783 38.7%, #69b778 41.9%, #6ab76c 45.2%, #69b760 48.4%, #67b754 51.6%, #65b747 54.8%, #64b63b 58.1%, #64b52d 61.3%, #65b321 64.5%, #65b216 67.7%, #64b00d 71.0%, #63ae06 74.2%, #63ac01 77.4%, #62aa00 80.6%, #62a700 83.9%, #62a500 87.1%, #61a200 90.3%, #609f03 93.5%, #5f9d07 96.8%, #5f9c0a 100.0%);
background: linear-gradient(90deg in oklch, oklch(71.26% 0.1240 250.31) 0.0%, oklch(71.36% 0.1185 246.18) 3.2%, oklch(71.51% 0.1103 240.63) 6.5%, oklch(71.69% 0.1008 233.98) 9.7%, oklch(71.85% 0.0916 226.57) 12.9%, oklch(71.98% 0.0842 218.70) 16.1%, oklch(72.05% 0.0802 210.69) 19.4%, oklch(72.03% 0.0803 202.21) 22.6%, oklch(71.96% 0.0832 192.46) 25.8%, oklch(71.84% 0.0883 182.10) 29.0%, oklch(71.69% 0.0950 171.86) 32.3%, oklch(71.52% 0.1028 162.44) 35.5%, oklch(71.34% 0.1111 154.58) 38.7%, oklch(71.15% 0.1199 148.82) 41.9%, oklch(70.95% 0.1309 144.70) 45.2%, oklch(70.74% 0.1434 141.83) 48.4%, oklch(70.50% 0.1562 139.83) 51.6%, oklch(70.22% 0.1680 138.36) 54.8%, oklch(69.90% 0.1776 137.04) 58.1%, oklch(69.53% 0.1841 135.62) 61.3%, oklch(69.10% 0.1880 134.57) 64.5%, oklch(68.62% 0.1901 133.94) 67.7%, oklch(68.10% 0.1907 133.59) 71.0%, oklch(67.55% 0.1904 133.40) 74.2%, oklch(66.99% 0.1895 133.23) 77.4%, oklch(66.42% 0.1873 132.95) 80.6%, oklch(65.76% 0.1846 132.67) 83.9%, oklch(65.04% 0.1819 132.45) 87.1%, oklch(64.30% 0.1793 132.28) 90.3%, oklch(63.60% 0.1762 132.14) 93.5%, oklch(63.02% 0.1730 132.04) 96.8%, oklch(62.60% 0.1709 131.96) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.713 | 0.124 | 250.3 |
| 2 | 0.72 | 0.08 | 209.1 |
| 3 | 0.713 | 0.114 | 152 |
| 4 | 0.697 | 0.182 | 136.2 |
| 5 | 0.665 | 0.189 | 133 |
| 6 | 0.626 | 0.171 | 132 |

## In these collections

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

## Other forms

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