# Tan, blue, teal and brown linear gradient

Tan, blue, teal and brown linear gradient with 7 colors: #e4b055, #43bbbb, #5b75b6, #184b8d, #7fc696, #e1b978, #924f1b. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kWyFo41aRTjUswVwoS3v6g54`
- Page: https://grabient.com/kWyFo41aRTjUswVwoS3v6g54
- Drawn as: linear gradient, 7 steps, 90 degrees
- Hues: multi-hue
- Contrast of its darkest and lightest colors: 4.6 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 | `#e4b055` | `oklch(78.74% 0.1240 79.45)` | Cookie Crust | black, 10.6 to 1 |
| 2 | `#43bbbb` | `oklch(72.60% 0.1048 195.34)` | Lagoon Rock | black, 9 to 1 |
| 3 | `#5b75b6` | `oklch(57.16% 0.1055 266.73)` | Wild Pansy | black, 4.6 to 1 |
| 4 | `#184b8d` | `oklch(41.73% 0.1226 256.99)` | Olympian Blue | white, 8.6 to 1 |
| 5 | `#7fc696` | `oklch(76.61% 0.0998 154.09)` | Good Luck Charm | black, 10.4 to 1 |
| 6 | `#e1b978` | `oklch(80.62% 0.0943 78.51)` | Veranda Yellow | black, 11.3 to 1 |
| 7 | `#924f1b` | `oklch(50.00% 0.1102 54.09)` | Nightcap | white, 6.2 to 1 |

## CSS

```css
background: linear-gradient(90deg, #e4b055 0.0%, #43bbbb 16.7%, #5b75b6 33.3%, #184b8d 50.0%, #7fc696 66.7%, #e1b978 83.3%, #924f1b 100.0%);
background: linear-gradient(90deg in oklch, oklch(78.74% 0.1240 79.45) 0.0%, oklch(72.60% 0.1048 195.34) 16.7%, oklch(57.16% 0.1055 266.73) 33.3%, oklch(41.73% 0.1226 256.99) 50.0%, oklch(76.61% 0.0998 154.09) 66.7%, oklch(80.62% 0.0943 78.51) 83.3%, oklch(50.00% 0.1102 54.09) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.787 | 0.124 | 79.5 |
| 2 | 0.673 | 0.099 | 245.4 |
| 3 | 0.417 | 0.123 | 257 |
| 4 | 0.886 | 0.091 | 104.8 |
| 5 | 0.5 | 0.11 | 54.1 |

## Other forms

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