# Tritone dark green, light blue and beige linear gradient

Tritone dark green, light blue and beige linear gradient with 7 colors: #003307, #006428, #008b64, #00a29b, #80d1db, #c1ecd9, #f0e0bc. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kWR0FnQjbBFGvRBwFkEc5Iyo`
- Page: https://grabient.com/kWR0FnQjbBFGvRBwFkEc5Iyo
- Drawn as: linear gradient, 7 steps, 90 degrees
- Kinds: dark to light, vivid
- Hues: analogous
- Contrast of its darkest and lightest colors: 11 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 | `#003307` | `oklch(27.96% 0.0886 144.75)` | Serpentine Shadow | white, 14.1 to 1 |
| 2 | `#006428` | `oklch(43.95% 0.1242 148.93)` | Woodland Wonder | white, 7.3 to 1 |
| 3 | `#008b64` | `oklch(56.48% 0.1187 165.03)` | Chagall Green | black, 4.8 to 1 |
| 4 | `#00a29b` | `oklch(64.18% 0.1111 189.23)` | Ceramic Blue Turquoise | black, 6.6 to 1 |
| 5 | `#80d1db` | `oklch(81.32% 0.0811 205.51)` | Sea of Tranquillity | black, 12.1 to 1 |
| 6 | `#c1ecd9` | `oklch(90.78% 0.0523 166.25)` | Seafoam Pearl | black, 16.2 to 1 |
| 7 | `#f0e0bc` | `oklch(90.94% 0.0496 86.72)` | Satin Souffle | black, 16 to 1 |

## CSS

```css
background: linear-gradient(90deg, #003307 0.0%, #006428 16.7%, #008b64 33.3%, #00a29b 50.0%, #80d1db 66.7%, #c1ecd9 83.3%, #f0e0bc 100.0%);
background: linear-gradient(90deg in oklch, oklch(27.96% 0.0886 144.75) 0.0%, oklch(43.95% 0.1242 148.93) 16.7%, oklch(56.48% 0.1187 165.03) 33.3%, oklch(64.18% 0.1111 189.23) 50.0%, oklch(81.32% 0.0811 205.51) 66.7%, oklch(90.78% 0.0523 166.25) 83.3%, oklch(90.94% 0.0496 86.72) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.28 | 0.09 | 144.8 |
| 2 | 0.52 | 0.15 | 154.4 |
| 3 | 0.642 | 0.13 | 189.2 |
| 4 | 0.882 | 0.061 | 198.7 |
| 5 | 0.909 | 0.05 | 86.7 |

## In these collections

- [Tropical swatches](https://grabient.com/tropical-swatches)

## Other forms

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