# Muted monochrome blue linear gradient

Muted monochrome blue linear gradient with 7 colors: #3a6195, #4e73a3, #6b8cb6, #7b97c0, #7385b4, #62669c, #584e89. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kSfEW2VRlALqiQ6`
- Page: https://grabient.com/kSfEW2VRlALqiQ6
- Drawn as: linear gradient, 7 steps, 90 degrees
- Kinds: muted, cool, monochrome
- Hues: analogous
- Contrast of its darkest and lightest colors: 2.4 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 | `#3a6195` | `oklch(48.82% 0.0951 255.94)` | Blue Regatta | white, 6.3 to 1 |
| 2 | `#4e73a3` | `oklch(54.96% 0.0864 255.39)` | Great Serpent | white, 4.8 to 1 |
| 3 | `#6b8cb6` | `oklch(63.11% 0.0748 255.08)` | Blue Dazzle | black, 6 to 1 |
| 4 | `#7b97c0` | `oklch(66.93% 0.0689 258.05)` | Denver River | black, 6.9 to 1 |
| 5 | `#7385b4` | `oklch(62.09% 0.0743 267.60)` | Kimono | black, 5.7 to 1 |
| 6 | `#62669c` | `oklch(52.92% 0.0854 280.44)` | Dark Horizon | white, 5.4 to 1 |
| 7 | `#584e89` | `oklch(46.06% 0.0937 289.75)` | Bright Eggplant | white, 7.3 to 1 |

## CSS

```css
background: linear-gradient(90deg, #3a6195 0.0%, #4e73a3 16.7%, #6b8cb6 33.3%, #7b97c0 50.0%, #7385b4 66.7%, #62669c 83.3%, #584e89 100.0%);
background: linear-gradient(90deg in oklch, oklch(48.82% 0.0951 255.94) 0.0%, oklch(54.96% 0.0864 255.39) 16.7%, oklch(63.11% 0.0748 255.08) 33.3%, oklch(66.93% 0.0689 258.05) 50.0%, oklch(62.09% 0.0743 267.60) 66.7%, oklch(52.92% 0.0854 280.44) 83.3%, oklch(46.06% 0.0937 289.75) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.488 | 0.095 | 255.9 |
| 2 | 0.669 | 0.069 | 258.1 |
| 3 | 0.461 | 0.094 | 289.8 |

## In these collections

- [Indigo gradients](https://grabient.com/indigo-gradients)
- [Cool blue](https://grabient.com/cool-blue)

## Other forms

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