# Gray and teal linear gradient

Gray and teal linear gradient with 7 colors: #eee4d0, #ded1bc, #c3b79f, #8a9c83, #527e7a, #3a6368, #2e5257. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kU6hU8Y41AMcRzC0j8Hg`
- Page: https://grabient.com/kU6hU8Y41AMcRzC0j8Hg
- Drawn as: linear gradient, 7 steps, 90 degrees
- Kinds: light to dark, neutral
- Hues: wide
- Contrast of its darkest and lightest colors: 6.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 | `#eee4d0` | `oklch(92.13% 0.0289 84.38)` | Tawny Daylily | black, 16.6 to 1 |
| 2 | `#ded1bc` | `oklch(86.64% 0.0316 78.96)` | Clambake | black, 13.9 to 1 |
| 3 | `#c3b79f` | `oklch(78.35% 0.0358 86.49)` | Wagon Wheel | black, 10.6 to 1 |
| 4 | `#8a9c83` | `oklch(67.18% 0.0428 137.34)` | Basil | black, 7.1 to 1 |
| 5 | `#527e7a` | `oklch(55.91% 0.0482 190.05)` | Nickel Ore Green | black, 4.6 to 1 |
| 6 | `#3a6368` | `oklch(47.22% 0.0462 204.98)` | China Green Blue | white, 6.6 to 1 |
| 7 | `#2e5257` | `oklch(41.34% 0.0427 206.96)` | Sea of Atlantis | white, 8.5 to 1 |

## CSS

```css
background: linear-gradient(90deg, #eee4d0 0.0%, #ded1bc 16.7%, #c3b79f 33.3%, #8a9c83 50.0%, #527e7a 66.7%, #3a6368 83.3%, #2e5257 100.0%);
background: linear-gradient(90deg in oklch, oklch(92.13% 0.0289 84.38) 0.0%, oklch(86.64% 0.0316 78.96) 16.7%, oklch(78.35% 0.0358 86.49) 33.3%, oklch(67.18% 0.0428 137.34) 50.0%, oklch(55.91% 0.0482 190.05) 66.7%, oklch(47.22% 0.0462 204.98) 83.3%, oklch(41.34% 0.0427 206.96) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.921 | 0.029 | 84.4 |
| 2 | 0.783 | 0.036 | 86.5 |
| 3 | 0.559 | 0.048 | 190.1 |
| 4 | 0.413 | 0.043 | 207 |

## In these collections

- [Modern swatches](https://grabient.com/modern-swatches)

## Other forms

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