# Gray, light blue and purple linear gradient

Gray, light blue and purple linear gradient with 7 colors: #617379, #9cb2b5, #e0f3f4, #8a94aa, #645471, #a6c5d8, #dfdcd1. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kYihGc5Ak9_iHwO0Ecv4hE5XGFrI`
- Page: https://grabient.com/kYihGc5Ak9_iHwO0Ecv4hE5XGFrI
- Drawn as: linear gradient, 7 steps, 90 degrees
- Kinds: neutral, cool
- Hues: analogous
- Contrast of its darkest and lightest colors: 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 | `#617379` | `oklch(54.33% 0.0234 220.08)` | Relaxed Navy | white, 4.9 to 1 |
| 2 | `#9cb2b5` | `oklch(74.87% 0.0249 204.72)` | Powder Mill | black, 9.4 to 1 |
| 3 | `#e0f3f4` | `oklch(95.00% 0.0199 200.98)` | Bone-Chilling | black, 18.2 to 1 |
| 4 | `#8a94aa` | `oklch(66.66% 0.0343 266.38)` | Silverfish | black, 6.9 to 1 |
| 5 | `#645471` | `oklch(47.23% 0.0510 310.06)` | Rich Texture | white, 6.9 to 1 |
| 6 | `#a6c5d8` | `oklch(80.73% 0.0430 234.11)` | Frozen Blue | black, 11.6 to 1 |
| 7 | `#dfdcd1` | `oklch(89.37% 0.0152 93.27)` | Nonchalant White | black, 15.2 to 1 |

## CSS

```css
background: linear-gradient(90deg, #617379 0.0%, #9cb2b5 16.7%, #e0f3f4 33.3%, #8a94aa 50.0%, #645471 66.7%, #a6c5d8 83.3%, #dfdcd1 100.0%);
background: linear-gradient(90deg in oklch, oklch(54.33% 0.0234 220.08) 0.0%, oklch(74.87% 0.0249 204.72) 16.7%, oklch(95.00% 0.0199 200.98) 33.3%, oklch(66.66% 0.0343 266.38) 50.0%, oklch(47.23% 0.0510 310.06) 66.7%, oklch(80.73% 0.0430 234.11) 83.3%, oklch(89.37% 0.0152 93.27) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.543 | 0.023 | 220.1 |
| 2 | 0.787 | 0.025 | 203.2 |
| 3 | 0.949 | 0.021 | 211.6 |
| 4 | 0.409 | 0.048 | 313.1 |
| 5 | 0.772 | 0.047 | 257.1 |
| 6 | 0.894 | 0.015 | 93.3 |

## Other forms

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