# Dark green, teal, navy and gray linear gradient

Dark green, teal, navy and gray linear gradient with 7 colors: #001f08, #073717, #0a4b42, #364b58, #132336, #464d66, #d6d0e9. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kWNS9qqxtA7MMyQgEML7ozEA`
- Page: https://grabient.com/kWNS9qqxtA7MMyQgEML7ozEA
- Drawn as: linear gradient, 7 steps, 90 degrees
- Kinds: dark center, dark, cool
- Hues: wide
- Contrast of its darkest and lightest colors: 11.7 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 | `#001f08` | `oklch(20.89% 0.0582 149.53)` | Clock Chimes Thirteen | white, 17.5 to 1 |
| 2 | `#073717` | `oklch(29.54% 0.0745 150.00)` | Gameboy Contrast | white, 13.4 to 1 |
| 3 | `#0a4b42` | `oklch(37.24% 0.0629 180.76)` | Aqua Deep | white, 10 to 1 |
| 4 | `#364b58` | `oklch(40.16% 0.0344 235.36)` | Sailor’s Coat | white, 9 to 1 |
| 5 | `#132336` | `oklch(25.28% 0.0415 253.48)` | Fog of War | white, 15.8 to 1 |
| 6 | `#464d66` | `oklch(42.40% 0.0430 272.94)` | Evening Over the Ocean | white, 8.3 to 1 |
| 7 | `#d6d0e9` | `oklch(87.01% 0.0344 295.60)` | Air Castle | black, 14 to 1 |

## CSS

```css
background: linear-gradient(90deg, #001f08 0.0%, #073717 16.7%, #0a4b42 33.3%, #364b58 50.0%, #132336 66.7%, #464d66 83.3%, #d6d0e9 100.0%);
background: linear-gradient(90deg in oklch, oklch(20.89% 0.0582 149.53) 0.0%, oklch(29.54% 0.0745 150.00) 16.7%, oklch(37.24% 0.0629 180.76) 33.3%, oklch(40.16% 0.0344 235.36) 50.0%, oklch(25.28% 0.0415 253.48) 66.7%, oklch(42.40% 0.0430 272.94) 83.3%, oklch(87.01% 0.0344 295.60) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.209 | 0.065 | 149.8 |
| 2 | 0.339 | 0.074 | 158.2 |
| 3 | 0.402 | 0.034 | 235.4 |
| 4 | 0.252 | 0.045 | 260.7 |
| 5 | 0.87 | 0.034 | 295.6 |

## In these collections

- [Winter swatches](https://grabient.com/winter-swatches)
- [Winter](https://grabient.com/winter)

## Other forms

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