# Blue color palette

The Blue color palette brings together dark blue and blue. The colors span a narrow lightness range, combining moderate color with gentle contrast. Its balanced and composed character suits travel posters and environmental mood boards. Its darkest tone is dark blue, and its lightest tone is blue.

- Also called: Monochrome navy and blue linear swatches
- Seed: `kUQja_qKS_DMrv85tkEA`
- Page: https://grabient.com/kUQja_qKS_DMrv85tkEA?style=linearSwatches&steps=13
- Drawn as: linear swatches, 13 steps, 90 degrees
- Kinds: dark, cool, monochrome
- Hues: monochromatic
- Contrast of its darkest and lightest colors: 2 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 | `#162048` | `oklch(25.98% 0.0744 269.30)` | Konkikyō Blue | white, 15.7 to 1 |
| 2 | `#16234d` | `oklch(26.99% 0.0793 267.82)` | Fly-by-Night | white, 15.2 to 1 |
| 3 | `#152654` | `oklch(28.42% 0.0863 265.66)` | Fibonacci Blue | white, 14.5 to 1 |
| 4 | `#142b5c` | `oklch(30.11% 0.0939 263.48)` | Schiava Blue | white, 13.7 to 1 |
| 5 | `#142f65` | `oklch(31.89% 0.1006 261.90)` | Mythical Night | white, 12.9 to 1 |
| 6 | `#15346d` | `oklch(33.86% 0.1057 260.94)` | Atlantic Navy | white, 11.9 to 1 |
| 7 | `#173a76` | `oklch(36.07% 0.1101 260.31)` | Azure Dragon | white, 10.9 to 1 |
| 8 | `#1b407f` | `oklch(38.26% 0.1145 260.22)` | Bracing Blue | white, 10 to 1 |
| 9 | `#1f4588` | `oklch(40.16% 0.1199 260.84)` | Indigo Hamlet | white, 9.2 to 1 |
| 10 | `#254891` | `oklch(41.78% 0.1271 262.70)` | Cascade Twilight | white, 8.7 to 1 |
| 11 | `#2c4a9a` | `oklch(43.23% 0.1356 265.53)` | Sea of Tears | white, 8.2 to 1 |
| 12 | `#334ba2` | `oklch(44.43% 0.1434 268.40)` | Dazzling Blue | white, 7.8 to 1 |
| 13 | `#384ca7` | `oklch(45.28% 0.1488 270.35)` | Dazzling Blue | white, 7.6 to 1 |

## CSS

```css
background: linear-gradient(90deg, #162048 0.000% 7.692%, #16234d 7.692% 15.385%, #152654 15.385% 23.077%, #142b5c 23.077% 30.769%, #142f65 30.769% 38.462%, #15346d 38.462% 46.154%, #173a76 46.154% 53.846%, #1b407f 53.846% 61.538%, #1f4588 61.538% 69.231%, #254891 69.231% 76.923%, #2c4a9a 76.923% 84.615%, #334ba2 84.615% 92.308%, #384ca7 92.308% 100.000%);
background: linear-gradient(90deg, oklch(25.98% 0.0744 269.30) 0.000% 7.692%, oklch(26.99% 0.0793 267.82) 7.692% 15.385%, oklch(28.42% 0.0863 265.66) 15.385% 23.077%, oklch(30.11% 0.0939 263.48) 23.077% 30.769%, oklch(31.89% 0.1006 261.90) 30.769% 38.462%, oklch(33.86% 0.1057 260.94) 38.462% 46.154%, oklch(36.07% 0.1101 260.31) 46.154% 53.846%, oklch(38.26% 0.1145 260.22) 53.846% 61.538%, oklch(40.16% 0.1199 260.84) 61.538% 69.231%, oklch(41.78% 0.1271 262.70) 69.231% 76.923%, oklch(43.23% 0.1356 265.53) 76.923% 84.615%, oklch(44.43% 0.1434 268.40) 84.615% 92.308%, oklch(45.28% 0.1488 270.35) 92.308% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.26 | 0.074 | 269.3 |
| 2 | 0.319 | 0.101 | 261.9 |
| 3 | 0.402 | 0.12 | 260.8 |
| 4 | 0.453 | 0.149 | 270.4 |

## In these collections

- [Ocean gradients](https://grabient.com/ocean-gradients)
- [Deep sea gradients](https://grabient.com/deep-sea-gradients)

## Other forms

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