# Vivid duotone cyan to blue linear gradient

Vivid duotone cyan to blue linear gradient with 32 colors: #0fe6dc, #20e4dd, #31e2df, #40dee0, #4bdbe1, #53d7e2, #55d4e2, #53d0e2, #4dcce2, #43c8e2, #38c3e3, #2abfe4, #1bbae5, #0eb5e5, #04b0e7, #01abe8, #03a6e9, #08a1ea, #0c9ceb, #0c97eb, #0492ec, #008ceb, #0087ea, #0082ea, #007deb, #0177ef, #1872f0, #286cf1, #3566f2, #3f60f2, #465bf2, #4b58f2. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kY1GiG5ijB9ywwhTukJSsjBUXSwe`
- Page: https://grabient.com/kY1GiG5ijB9ywwhTukJSsjBUXSwe?steps=32&angle=15
- Drawn as: linear gradient, 32 steps, 15 degrees
- Kinds: vivid, cool
- Hues: wide
- Contrast of its darkest and lightest colors: 3.3 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 | `#0fe6dc` | `oklch(83.46% 0.1433 189.14)` | Bright Turquoise | black, 13.3 to 1 |
| 2 | `#20e4dd` | `oklch(83.18% 0.1394 190.90)` | Bright Turquoise | black, 13.2 to 1 |
| 3 | `#31e2df` | `oklch(82.83% 0.1335 193.31)` | Fish Boy | black, 13 to 1 |
| 4 | `#40dee0` | `oklch(82.41% 0.1268 196.17)` | Neon Nazar | black, 12.7 to 1 |
| 5 | `#4bdbe1` | `oklch(81.88% 0.1202 199.28)` | Neon Nazar | black, 12.5 to 1 |
| 6 | `#53d7e2` | `oklch(81.24% 0.1148 202.45)` | Neon Nazar | black, 12.2 to 1 |
| 7 | `#55d4e2` | `oklch(80.48% 0.1118 205.48)` | Blue Radiance | black, 11.8 to 1 |
| 8 | `#53d0e2` | `oklch(79.56% 0.1118 208.30)` | Watercourse | black, 11.5 to 1 |
| 9 | `#4dcce2` | `oklch(78.45% 0.1140 211.12)` | Watercourse | black, 11 to 1 |
| 10 | `#43c8e2` | `oklch(77.21% 0.1177 213.97)` | Naxos Sky | black, 10.5 to 1 |
| 11 | `#38c3e3` | `oklch(75.90% 0.1224 216.86)` | Caribbean Blue | black, 10.1 to 1 |
| 12 | `#2abfe4` | `oklch(74.58% 0.1273 219.79)` | Blue Raspberry | black, 9.6 to 1 |
| 13 | `#1bbae5` | `oklch(73.31% 0.1320 222.79)` | Blue Bikini | black, 9.1 to 1 |
| 14 | `#0eb5e5` | `oklch(72.13% 0.1360 225.91)` | Blue Atoll | black, 8.7 to 1 |
| 15 | `#04b0e7` | `oklch(70.98% 0.1398 229.25)` | Lynx Screen Blue | black, 8.3 to 1 |
| 16 | `#01abe8` | `oklch(69.84% 0.1436 232.72)` | Huelveño Horizon | black, 8 to 1 |
| 17 | `#03a6e9` | `oklch(68.70% 0.1477 236.16)` | Vivid Cerulean | black, 7.6 to 1 |
| 18 | `#08a1ea` | `oklch(67.57% 0.1520 239.46)` | Button Blue | black, 7.3 to 1 |
| 19 | `#0c9ceb` | `oklch(66.43% 0.1567 242.47)` | Out of the Blue | black, 6.9 to 1 |
| 20 | `#0c97eb` | `oklch(65.28% 0.1621 245.07)` | Pervenche | black, 6.6 to 1 |
| 21 | `#0492ec` | `oklch(64.09% 0.1682 247.18)` | Karimun Blue | black, 6.2 to 1 |
| 22 | `#008ceb` | `oklch(62.86% 0.1733 248.98)` | Bleu de France | black, 5.9 to 1 |
| 23 | `#0087ea` | `oklch(61.65% 0.1773 250.59)` | Blue Cola | black, 5.6 to 1 |
| 24 | `#0082ea` | `oklch(60.49% 0.1822 252.22)` | Blue Cola | black, 5.3 to 1 |
| 25 | `#007deb` | `oklch(59.42% 0.1894 254.03)` | Blue Darknut | black, 5.1 to 1 |
| 26 | `#0177ef` | `oklch(58.48% 0.2009 256.19)` | Blue Darknut | black, 4.8 to 1 |
| 27 | `#1872f0` | `oklch(57.64% 0.2063 258.91)` | Níu Zǎi Sè Denim | black, 4.6 to 1 |
| 28 | `#286cf1` | `oklch(56.87% 0.2116 262.01)` | Níu Zǎi Sè Denim | white, 4.6 to 1 |
| 29 | `#3566f2` | `oklch(56.19% 0.2166 265.21)` | Secret of Mana | white, 4.8 to 1 |
| 30 | `#3f60f2` | `oklch(55.59% 0.2209 268.24)` | Secret of Mana | white, 5 to 1 |
| 31 | `#465bf2` | `oklch(55.10% 0.2246 270.80)` | Aquarius Mood Indigo | white, 5.1 to 1 |
| 32 | `#4b58f2` | `oklch(54.72% 0.2274 272.62)` | Aquarius Mood Indigo | white, 5.2 to 1 |

## CSS

```css
background: linear-gradient(15deg, #0fe6dc 0.0%, #20e4dd 3.2%, #31e2df 6.5%, #40dee0 9.7%, #4bdbe1 12.9%, #53d7e2 16.1%, #55d4e2 19.4%, #53d0e2 22.6%, #4dcce2 25.8%, #43c8e2 29.0%, #38c3e3 32.3%, #2abfe4 35.5%, #1bbae5 38.7%, #0eb5e5 41.9%, #04b0e7 45.2%, #01abe8 48.4%, #03a6e9 51.6%, #08a1ea 54.8%, #0c9ceb 58.1%, #0c97eb 61.3%, #0492ec 64.5%, #008ceb 67.7%, #0087ea 71.0%, #0082ea 74.2%, #007deb 77.4%, #0177ef 80.6%, #1872f0 83.9%, #286cf1 87.1%, #3566f2 90.3%, #3f60f2 93.5%, #465bf2 96.8%, #4b58f2 100.0%);
background: linear-gradient(15deg in oklch, oklch(83.46% 0.1433 189.14) 0.0%, oklch(83.18% 0.1394 190.90) 3.2%, oklch(82.83% 0.1335 193.31) 6.5%, oklch(82.41% 0.1268 196.17) 9.7%, oklch(81.88% 0.1202 199.28) 12.9%, oklch(81.24% 0.1148 202.45) 16.1%, oklch(80.48% 0.1118 205.48) 19.4%, oklch(79.56% 0.1118 208.30) 22.6%, oklch(78.45% 0.1140 211.12) 25.8%, oklch(77.21% 0.1177 213.97) 29.0%, oklch(75.90% 0.1224 216.86) 32.3%, oklch(74.58% 0.1273 219.79) 35.5%, oklch(73.31% 0.1320 222.79) 38.7%, oklch(72.13% 0.1360 225.91) 41.9%, oklch(70.98% 0.1398 229.25) 45.2%, oklch(69.84% 0.1436 232.72) 48.4%, oklch(68.70% 0.1477 236.16) 51.6%, oklch(67.57% 0.1520 239.46) 54.8%, oklch(66.43% 0.1567 242.47) 58.1%, oklch(65.28% 0.1621 245.07) 61.3%, oklch(64.09% 0.1682 247.18) 64.5%, oklch(62.86% 0.1733 248.98) 67.7%, oklch(61.65% 0.1773 250.59) 71.0%, oklch(60.49% 0.1822 252.22) 74.2%, oklch(59.42% 0.1894 254.03) 77.4%, oklch(58.48% 0.2009 256.19) 80.6%, oklch(57.64% 0.2063 258.91) 83.9%, oklch(56.87% 0.2116 262.01) 87.1%, oklch(56.19% 0.2166 265.21) 90.3%, oklch(55.59% 0.2209 268.24) 93.5%, oklch(55.10% 0.2246 270.80) 96.8%, oklch(54.72% 0.2274 272.62) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.835 | 0.143 | 189.1 |
| 2 | 0.803 | 0.112 | 206 |
| 3 | 0.728 | 0.134 | 224 |
| 4 | 0.657 | 0.16 | 244.1 |
| 5 | 0.587 | 0.2 | 255.7 |
| 6 | 0.547 | 0.227 | 272.6 |

## In these collections

- [Electric blue gradients](https://grabient.com/electric-blue-gradients)
- [Neon gradients](https://grabient.com/neon-gradients)

## Other forms

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