# Analogous teal, green and yellow linear gradient

Analogous teal, green and yellow linear gradient with 32 colors: #014845, #014c48, #01524d, #025852, #046059, #05685f, #077066, #08796c, #088272, #078b77, #06937a, #039a7b, #01a17b, #05a878, #14af72, #26b56b, #38bb60, #4bbf53, #5dc444, #6ec730, #7ecb14, #8ecd00, #9cd000, #a8d300, #b3d700, #bdda00, #c6dd00, #cfe100, #d6e400, #dde608, #e3e81a, #e7ea21. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kUXC2HTCk-GJMOrzRj2g`
- Page: https://grabient.com/kUXC2HTCk-GJMOrzRj2g?steps=32&angle=45
- Drawn as: linear gradient, 32 steps, 45 degrees
- Kinds: dark to light, vivid
- Hues: analogous
- Contrast of its darkest and lightest colors: 8 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 | `#014845` | `oklch(36.22% 0.0620 189.84)` | Cyprus | white, 10.4 to 1 |
| 2 | `#014c48` | `oklch(37.60% 0.0647 189.06)` | Swamp Mausoleum | white, 9.8 to 1 |
| 3 | `#01524d` | `oklch(39.40% 0.0680 188.20)` | Myrtle Deep Green | white, 9.1 to 1 |
| 4 | `#025852` | `oklch(41.54% 0.0717 187.25)` | Castleton Green | white, 8.3 to 1 |
| 5 | `#046059` | `oklch(43.94% 0.0759 186.17)` | Empress Teal | white, 7.4 to 1 |
| 6 | `#05685f` | `oklch(46.51% 0.0806 184.92)` | Evergreen Forest | white, 6.6 to 1 |
| 7 | `#077066` | `oklch(49.18% 0.0858 183.47)` | Tide Pools | white, 5.9 to 1 |
| 8 | `#08796c` | `oklch(51.86% 0.0914 181.78)` | Pond Moss | white, 5.2 to 1 |
| 9 | `#088272` | `oklch(54.47% 0.0974 179.82)` | Green Garlands | white, 4.7 to 1 |
| 10 | `#078b77` | `oklch(56.93% 0.1038 177.55)` | Emerald Enchantment | black, 4.9 to 1 |
| 11 | `#06937a` | `oklch(59.16% 0.1106 174.94)` | Aqua Waters | black, 5.4 to 1 |
| 12 | `#039a7b` | `oklch(61.15% 0.1182 171.89)` | Paolo Veronese Green | black, 5.9 to 1 |
| 13 | `#01a17b` | `oklch(63.04% 0.1272 168.18)` | Sport Green | black, 6.3 to 1 |
| 14 | `#05a878` | `oklch(64.86% 0.1374 163.94)` | Dragon Scale | black, 6.8 to 1 |
| 15 | `#14af72` | `oklch(66.61% 0.1484 159.32)` | Jade Powder | black, 7.3 to 1 |
| 16 | `#26b56b` | `oklch(68.31% 0.1598 154.47)` | Green Mana | black, 7.9 to 1 |
| 17 | `#38bb60` | `oklch(69.96% 0.1710 149.53)` | Welsh Onion | black, 8.4 to 1 |
| 18 | `#4bbf53` | `oklch(71.57% 0.1817 144.64)` | Range Land | black, 8.9 to 1 |
| 19 | `#5dc444` | `oklch(73.13% 0.1915 139.97)` | Zunda Green | black, 9.4 to 1 |
| 20 | `#6ec730` | `oklch(74.66% 0.1998 135.64)` | Bitter Dandelion | black, 9.9 to 1 |
| 21 | `#7ecb14` | `oklch(76.17% 0.2063 131.81)` | Delicious Dill | black, 10.4 to 1 |
| 22 | `#8ecd00` | `oklch(77.66% 0.2048 128.61)` | Green Cape | black, 10.9 to 1 |
| 23 | `#9cd000` | `oklch(79.18% 0.2010 125.78)` | Viric Green | black, 11.4 to 1 |
| 24 | `#a8d300` | `oklch(80.72% 0.1986 123.22)` | Jeune Citron | black, 12 to 1 |
| 25 | `#b3d700` | `oklch(82.25% 0.1972 120.93)` | King Lime | black, 12.5 to 1 |
| 26 | `#bdda00` | `oklch(83.74% 0.1966 118.87)` | Cucumber Bomber | black, 13.1 to 1 |
| 27 | `#c6dd00` | `oklch(85.18% 0.1965 117.03)` | Octarine | black, 13.7 to 1 |
| 28 | `#cfe100` | `oklch(86.52% 0.1967 115.40)` | Electric Energy | black, 14.3 to 1 |
| 29 | `#d6e400` | `oklch(87.76% 0.1972 113.96)` | Sickly Yellow | black, 14.9 to 1 |
| 30 | `#dde608` | `oklch(88.86% 0.1968 112.69)` | Peridot | black, 15.4 to 1 |
| 31 | `#e3e81a` | `oklch(89.80% 0.1943 111.57)` | Birdie | black, 15.8 to 1 |
| 32 | `#e7ea21` | `oklch(90.55% 0.1929 110.59)` | Pika Yellow | black, 16.2 to 1 |

## CSS

```css
background: linear-gradient(45deg, #014845 0.0%, #014c48 3.2%, #01524d 6.5%, #025852 9.7%, #046059 12.9%, #05685f 16.1%, #077066 19.4%, #08796c 22.6%, #088272 25.8%, #078b77 29.0%, #06937a 32.3%, #039a7b 35.5%, #01a17b 38.7%, #05a878 41.9%, #14af72 45.2%, #26b56b 48.4%, #38bb60 51.6%, #4bbf53 54.8%, #5dc444 58.1%, #6ec730 61.3%, #7ecb14 64.5%, #8ecd00 67.7%, #9cd000 71.0%, #a8d300 74.2%, #b3d700 77.4%, #bdda00 80.6%, #c6dd00 83.9%, #cfe100 87.1%, #d6e400 90.3%, #dde608 93.5%, #e3e81a 96.8%, #e7ea21 100.0%);
background: linear-gradient(45deg in oklch, oklch(36.22% 0.0620 189.84) 0.0%, oklch(37.60% 0.0647 189.06) 3.2%, oklch(39.40% 0.0680 188.20) 6.5%, oklch(41.54% 0.0717 187.25) 9.7%, oklch(43.94% 0.0759 186.17) 12.9%, oklch(46.51% 0.0806 184.92) 16.1%, oklch(49.18% 0.0858 183.47) 19.4%, oklch(51.86% 0.0914 181.78) 22.6%, oklch(54.47% 0.0974 179.82) 25.8%, oklch(56.93% 0.1038 177.55) 29.0%, oklch(59.16% 0.1106 174.94) 32.3%, oklch(61.15% 0.1182 171.89) 35.5%, oklch(63.04% 0.1272 168.18) 38.7%, oklch(64.86% 0.1374 163.94) 41.9%, oklch(66.61% 0.1484 159.32) 45.2%, oklch(68.31% 0.1598 154.47) 48.4%, oklch(69.96% 0.1710 149.53) 51.6%, oklch(71.57% 0.1817 144.64) 54.8%, oklch(73.13% 0.1915 139.97) 58.1%, oklch(74.66% 0.1998 135.64) 61.3%, oklch(76.17% 0.2063 131.81) 64.5%, oklch(77.66% 0.2048 128.61) 67.7%, oklch(79.18% 0.2010 125.78) 71.0%, oklch(80.72% 0.1986 123.22) 74.2%, oklch(82.25% 0.1972 120.93) 77.4%, oklch(83.74% 0.1966 118.87) 80.6%, oklch(85.18% 0.1965 117.03) 83.9%, oklch(86.52% 0.1967 115.40) 87.1%, oklch(87.76% 0.1972 113.96) 90.3%, oklch(88.86% 0.1968 112.69) 93.5%, oklch(89.80% 0.1943 111.57) 96.8%, oklch(90.55% 0.1929 110.59) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.362 | 0.062 | 189.8 |
| 2 | 0.598 | 0.113 | 174 |
| 3 | 0.772 | 0.209 | 129.6 |
| 4 | 0.906 | 0.193 | 110.6 |

## In these collections

- [Neon swatches](https://grabient.com/neon-swatches)
- [Neon gradients](https://grabient.com/neon-gradients)

## Other forms

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