# Blue, light green, brown and dark green linear gradient

Blue, light green, brown and dark green linear gradient with 7 colors: #4c6b90, #85bfac, #f4e6b7, #a48c61, #3b3902, #004037, #1d4b79. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kUhDK0dZctCqZwYzodDg`
- Page: https://grabient.com/kUhDK0dZctCqZwYzodDg
- Drawn as: linear gradient, 7 steps, 90 degrees
- Kinds: light center, multicolor
- Hues: wide
- Contrast of its darkest and lightest colors: 9.5 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 | `#4c6b90` | `oklch(51.97% 0.0689 253.12)` | Wickford Bay | white, 5.5 to 1 |
| 2 | `#85bfac` | `oklch(75.94% 0.0657 172.48)` | Seaborn | black, 10 to 1 |
| 3 | `#f4e6b7` | `oklch(92.52% 0.0634 93.56)` | Martica | black, 16.8 to 1 |
| 4 | `#a48c61` | `oklch(65.08% 0.0651 81.47)` | Rattan | black, 6.4 to 1 |
| 5 | `#3b3902` | `oklch(33.46% 0.0703 107.29)` | Camouflage | white, 11.9 to 1 |
| 6 | `#004037` | `oklch(33.32% 0.0605 179.98)` | Botanical Night | white, 11.7 to 1 |
| 7 | `#1d4b79` | `oklch(40.55% 0.0923 251.01)` | Seashell Cove | white, 8.9 to 1 |

## CSS

```css
background: linear-gradient(90deg, #4c6b90 0.0%, #85bfac 16.7%, #f4e6b7 33.3%, #a48c61 50.0%, #3b3902 66.7%, #004037 83.3%, #1d4b79 100.0%);
background: linear-gradient(90deg in oklch, oklch(51.97% 0.0689 253.12) 0.0%, oklch(75.94% 0.0657 172.48) 16.7%, oklch(92.52% 0.0634 93.56) 33.3%, oklch(65.08% 0.0651 81.47) 50.0%, oklch(33.46% 0.0703 107.29) 66.7%, oklch(33.32% 0.0605 179.98) 83.3%, oklch(40.55% 0.0923 251.01) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.52 | 0.069 | 253.1 |
| 2 | 0.925 | 0.063 | 93.6 |
| 3 | 0.335 | 0.07 | 107.3 |
| 4 | 0.406 | 0.092 | 251 |

## In these collections

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

## Other forms

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