# Cool blue, teal and dark green linear gradient

Cool blue, teal and dark green linear gradient with 8 colors: #3a439c, #2db0cc, #00aa98, #00ae7d, #09a763, #108d51, #0d7043, #055639. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kcbWjDWSm5FQrO_Us73Ubg-8gxv89KEAsx_AY`
- Page: https://grabient.com/kcbWjDWSm5FQrO_Us73Ubg-8gxv89KEAsx_AY?steps=8
- Drawn as: linear gradient, 8 steps, 90 degrees
- Kinds: light center, vivid, cool
- Hues: analogous
- Contrast of its darkest and lightest colors: 3.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 | `#3a439c` | `oklch(42.91% 0.1433 274.22)` | Galaxy Express | white, 8.4 to 1 |
| 2 | `#2db0cc` | `oklch(70.08% 0.1144 216.10)` | Aquarius | black, 8.1 to 1 |
| 3 | `#00aa98` | `oklch(66.14% 0.1183 182.28)` | Tropical Hideaway | black, 7.1 to 1 |
| 4 | `#00ae7d` | `oklch(66.54% 0.1412 164.31)` | Bright Camouflage | black, 7.3 to 1 |
| 5 | `#09a763` | `oklch(64.17% 0.1543 155.86)` | Greedo Green | black, 6.7 to 1 |
| 6 | `#108d51` | `oklch(56.69% 0.1364 154.81)` | Iceland Green | black, 4.9 to 1 |
| 7 | `#0d7043` | `oklch(48.03% 0.1102 156.92)` | Diisha Green | white, 6.1 to 1 |
| 8 | `#055639` | `oklch(40.16% 0.0868 161.15)` | Permanent Green | white, 8.7 to 1 |

## CSS

```css
background: linear-gradient(90deg, #3a439c 0.0%, #2db0cc 14.3%, #00aa98 28.6%, #00ae7d 42.9%, #09a763 57.1%, #108d51 71.4%, #0d7043 85.7%, #055639 100.0%);
background: linear-gradient(90deg in oklch, oklch(42.91% 0.1433 274.22) 0.0%, oklch(70.08% 0.1144 216.10) 14.3%, oklch(66.14% 0.1183 182.28) 28.6%, oklch(66.54% 0.1412 164.31) 42.9%, oklch(64.17% 0.1543 155.86) 57.1%, oklch(56.69% 0.1364 154.81) 71.4%, oklch(48.03% 0.1102 156.92) 85.7%, oklch(40.16% 0.0868 161.15) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.429 | 0.143 | 274.2 |
| 2 | 0.701 | 0.114 | 216.1 |
| 3 | 0.661 | 0.119 | 182.3 |
| 4 | 0.665 | 0.142 | 164.3 |
| 5 | 0.642 | 0.154 | 155.9 |
| 6 | 0.567 | 0.136 | 154.8 |
| 7 | 0.48 | 0.11 | 156.9 |
| 8 | 0.402 | 0.087 | 161.1 |

## In these collections

- [Green multicolor gradients](https://grabient.com/green-multicolor-gradients)

## Other forms

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