# Muted monochrome navy to light blue linear gradient

Muted monochrome navy to light blue linear gradient with 7 colors: #2b3f64, #2d3e5c, #3a4d68, #546d8a, #7695b3, #97b8d2, #b3d0e3. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kWXjK6sBM_kMTvxbFL86w8-w`
- Page: https://grabient.com/kWXjK6sBM_kMTvxbFL86w8-w
- Drawn as: linear gradient, 7 steps, 90 degrees
- Kinds: dark to light, muted, cool, monochrome
- Hues: analogous
- Contrast of its darkest and lightest colors: 6.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 | `#2b3f64` | `oklch(37.01% 0.0689 262.27)` | Elmer’s Echo | white, 10.4 to 1 |
| 2 | `#2d3e5c` | `oklch(36.45% 0.0572 260.58)` | Gulf Blue | white, 10.6 to 1 |
| 3 | `#3a4d68` | `oklch(41.59% 0.0514 256.90)` | Calico Dress | white, 8.6 to 1 |
| 4 | `#546d8a` | `oklch(52.76% 0.0537 251.70)` | Electronic | white, 5.3 to 1 |
| 5 | `#7695b3` | `oklch(65.68% 0.0569 247.67)` | Ocean Ridge | black, 6.7 to 1 |
| 6 | `#97b8d2` | `oklch(76.79% 0.0522 242.07)` | Blue Pointer | black, 10.1 to 1 |
| 7 | `#b3d0e3` | `oklch(84.25% 0.0413 235.85)` | Holiday Road | black, 13 to 1 |

## CSS

```css
background: linear-gradient(90deg, #2b3f64 0.0%, #2d3e5c 16.7%, #3a4d68 33.3%, #546d8a 50.0%, #7695b3 66.7%, #97b8d2 83.3%, #b3d0e3 100.0%);
background: linear-gradient(90deg in oklch, oklch(37.01% 0.0689 262.27) 0.0%, oklch(36.45% 0.0572 260.58) 16.7%, oklch(41.59% 0.0514 256.90) 33.3%, oklch(52.76% 0.0537 251.70) 50.0%, oklch(65.68% 0.0569 247.67) 66.7%, oklch(76.79% 0.0522 242.07) 83.3%, oklch(84.25% 0.0413 235.85) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.37 | 0.069 | 262.3 |
| 2 | 0.378 | 0.052 | 259.1 |
| 3 | 0.528 | 0.054 | 251.7 |
| 4 | 0.717 | 0.056 | 245.4 |
| 5 | 0.843 | 0.041 | 235.8 |

## In these collections

- [Snow gum blue hour](https://grabient.com/snow-gum-blue-hour)

## Other forms

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