# Blue blue palette

The Blue blue palette brings together light blue and blue. The colors span a broad lightness range, combining strong color with clear contrast. Its bold and dramatic character suits brand mood boards and editorial graphics. Its darkest tone is blue, and its lightest tone is light blue.

- Also called: Monochrome light blue and blue linear swatches
- Seed: `kY3BidYR_EdKvQJCuEAM8Q_6vSP-`
- Page: https://grabient.com/kY3BidYR_EdKvQJCuEAM8Q_6vSP-?style=linearSwatches&steps=13
- Drawn as: linear swatches, 13 steps, 90 degrees
- Kinds: light to dark, cool, monochrome
- Hues: monochromatic
- Contrast of its darkest and lightest colors: 8.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 | `#bcd9e2` | `oklch(86.61% 0.0331 220.78)` | Glacial Stream | black, 14.1 to 1 |
| 2 | `#a8cee5` | `oklch(83.13% 0.0522 235.59)` | Escape | black, 12.6 to 1 |
| 3 | `#96bbea` | `oklch(78.27% 0.0779 253.94)` | Blue Shutters | black, 10.6 to 1 |
| 4 | `#88aae8` | `oklch(73.63% 0.0987 262.55)` | Queer Blue | black, 8.9 to 1 |
| 5 | `#769ae4` | `oklch(68.90% 0.1170 263.87)` | Little Boy Blue | black, 7.4 to 1 |
| 6 | `#6389dc` | `oklch(63.95% 0.1322 264.35)` | Blue Jay | black, 6.1 to 1 |
| 7 | `#5278d0` | `oklch(58.69% 0.1425 264.97)` | Serenity’s Reign | black, 4.9 to 1 |
| 8 | `#4167c4` | `oklch(53.39% 0.1520 265.13)` | God of Rain | white, 5.3 to 1 |
| 9 | `#3055b9` | `oklch(48.16% 0.1645 265.24)` | Cerulean Blue | white, 6.7 to 1 |
| 10 | `#1e43b0` | `oklch(43.10% 0.1786 265.19)` | Denim | white, 8.4 to 1 |
| 11 | `#1132ab` | `oklch(39.11% 0.1940 265.16)` | Blue Hour | white, 10.1 to 1 |
| 12 | `#0820aa` | `oklch(36.15% 0.2124 265.16)` | City Hunter Blue | white, 11.6 to 1 |
| 13 | `#060bab` | `oklch(34.25% 0.2260 265.16)` | Extravehicular Activity | white, 12.7 to 1 |

## CSS

```css
background: linear-gradient(90deg, #bcd9e2 0.000% 7.692%, #a8cee5 7.692% 15.385%, #96bbea 15.385% 23.077%, #88aae8 23.077% 30.769%, #769ae4 30.769% 38.462%, #6389dc 38.462% 46.154%, #5278d0 46.154% 53.846%, #4167c4 53.846% 61.538%, #3055b9 61.538% 69.231%, #1e43b0 69.231% 76.923%, #1132ab 76.923% 84.615%, #0820aa 84.615% 92.308%, #060bab 92.308% 100.000%);
background: linear-gradient(90deg, oklch(86.61% 0.0331 220.78) 0.000% 7.692%, oklch(83.13% 0.0522 235.59) 7.692% 15.385%, oklch(78.27% 0.0779 253.94) 15.385% 23.077%, oklch(73.63% 0.0987 262.55) 23.077% 30.769%, oklch(68.90% 0.1170 263.87) 30.769% 38.462%, oklch(63.95% 0.1322 264.35) 38.462% 46.154%, oklch(58.69% 0.1425 264.97) 46.154% 53.846%, oklch(53.39% 0.1520 265.13) 53.846% 61.538%, oklch(48.16% 0.1645 265.24) 61.538% 69.231%, oklch(43.10% 0.1786 265.19) 69.231% 76.923%, oklch(39.11% 0.1940 265.16) 76.923% 84.615%, oklch(36.15% 0.2124 265.16) 84.615% 92.308%, oklch(34.25% 0.2260 265.16) 92.308% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.866 | 0.033 | 220.8 |
| 2 | 0.764 | 0.087 | 258.8 |
| 3 | 0.65 | 0.13 | 264.1 |
| 4 | 0.524 | 0.154 | 265.2 |
| 5 | 0.406 | 0.187 | 265.2 |
| 6 | 0.343 | 0.226 | 265.2 |

## In these collections

- [Navy swatches](https://grabient.com/navy-swatches)
- [Blue swatches](https://grabient.com/blue-swatches)

## Other forms

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