# Deep Blue Ascent

The Blue cool blue palette brings together dark 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 dark blue, and its lightest tone is blue.

- Also called: Monochrome navy to blue linear gradient
- Seed: `kWMDC_IqQ_rAwP1AOj90bw-4`
- Page: https://grabient.com/kWMDC_IqQ_rAwP1AOj90bw-4?steps=32
- Drawn as: linear gradient, 32 steps, 90 degrees
- Kinds: dark to light, vivid, dark, cool, monochrome
- Hues: analogous
- Contrast of its darkest and lightest colors: 5.5 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 | `#081031` | `oklch(18.90% 0.0661 268.59)` | Squid’s Ink | white, 18.6 to 1 |
| 2 | `#081133` | `oklch(19.54% 0.0688 268.45)` | Infinite Night | white, 18.4 to 1 |
| 3 | `#091337` | `oklch(20.39% 0.0723 268.28)` | Infinite Night | white, 18.1 to 1 |
| 4 | `#0a153c` | `oklch(21.39% 0.0765 268.07)` | Navy | white, 17.7 to 1 |
| 5 | `#0c1741` | `oklch(22.51% 0.0812 267.83)` | Deadly Depths | white, 17.2 to 1 |
| 6 | `#0d1a47` | `oklch(23.72% 0.0861 267.55)` | Tetsu-Kon Blue | white, 16.7 to 1 |
| 7 | `#0e1c4c` | `oklch(24.98% 0.0911 267.21)` | Tetsu-Kon Blue | white, 16.2 to 1 |
| 8 | `#101f52` | `oklch(26.24% 0.0959 266.82)` | Dark Soul | white, 15.6 to 1 |
| 9 | `#112258` | `oklch(27.47% 0.1003 266.36)` | Fibonacci Blue | white, 15.1 to 1 |
| 10 | `#12255e` | `oklch(28.72% 0.1046 265.80)` | Fibonacci Blue | white, 14.5 to 1 |
| 11 | `#122863` | `oklch(30.02% 0.1090 265.15)` | Schiava Blue | white, 13.8 to 1 |
| 12 | `#132b6a` | `oklch(31.36% 0.1134 264.43)` | Deep Sea Dream | white, 13.2 to 1 |
| 13 | `#132f70` | `oklch(32.73% 0.1177 263.69)` | Atlantic Navy | white, 12.6 to 1 |
| 14 | `#133376` | `oklch(34.14% 0.1220 262.93)` | Twilight Express | white, 11.9 to 1 |
| 15 | `#14367d` | `oklch(35.58% 0.1262 262.20)` | Cobalt Blue Tarantula | white, 11.2 to 1 |
| 16 | `#143a83` | `oklch(37.05% 0.1303 261.51)` | Mystery Oceans | white, 10.6 to 1 |
| 17 | `#143f8a` | `oklch(38.55% 0.1343 260.90)` | Mystery Oceans | white, 10 to 1 |
| 18 | `#154391` | `oklch(40.09% 0.1383 260.38)` | Liberalist | white, 9.3 to 1 |
| 19 | `#154798` | `oklch(41.67% 0.1424 259.90)` | Space Explorer | white, 8.7 to 1 |
| 20 | `#164c9f` | `oklch(43.29% 0.1463 259.45)` | Sea of Tears | white, 8.1 to 1 |
| 21 | `#1751a6` | `oklch(44.93% 0.1501 258.99)` | Victoria Blue | white, 7.6 to 1 |
| 22 | `#1856ad` | `oklch(46.59% 0.1536 258.47)` | Blue Lobster | white, 7 to 1 |
| 23 | `#195bb4` | `oklch(48.27% 0.1567 257.88)` | Bottled Sea | white, 6.5 to 1 |
| 24 | `#1960bb` | `oklch(49.97% 0.1593 257.17)` | Amnesia Blue | white, 6.1 to 1 |
| 25 | `#1966c2` | `oklch(51.74% 0.1613 256.28)` | Blue Diamond | white, 5.6 to 1 |
| 26 | `#1a6cc9` | `oklch(53.70% 0.1627 255.18)` | Mimesia Blue | white, 5.1 to 1 |
| 27 | `#1a73d0` | `oklch(55.76% 0.1637 253.94)` | Bright Navy Blue | white, 4.7 to 1 |
| 28 | `#1a7bd7` | `oklch(57.82% 0.1643 252.64)` | Soothing Sapphire | black, 4.8 to 1 |
| 29 | `#1b81dd` | `oklch(59.79% 0.1646 251.37)` | Soothing Sapphire | black, 5.2 to 1 |
| 30 | `#1b88e3` | `oklch(61.57% 0.1649 250.20)` | Blue Cola | black, 5.6 to 1 |
| 31 | `#1c8de8` | `oklch(63.06% 0.1651 249.22)` | Bleu de France | black, 6 to 1 |
| 32 | `#1c91eb` | `oklch(64.17% 0.1654 248.52)` | Bleu de France | black, 6.3 to 1 |

## CSS

```css
background: linear-gradient(90deg, #081031 0.0%, #081133 3.2%, #091337 6.5%, #0a153c 9.7%, #0c1741 12.9%, #0d1a47 16.1%, #0e1c4c 19.4%, #101f52 22.6%, #112258 25.8%, #12255e 29.0%, #122863 32.3%, #132b6a 35.5%, #132f70 38.7%, #133376 41.9%, #14367d 45.2%, #143a83 48.4%, #143f8a 51.6%, #154391 54.8%, #154798 58.1%, #164c9f 61.3%, #1751a6 64.5%, #1856ad 67.7%, #195bb4 71.0%, #1960bb 74.2%, #1966c2 77.4%, #1a6cc9 80.6%, #1a73d0 83.9%, #1a7bd7 87.1%, #1b81dd 90.3%, #1b88e3 93.5%, #1c8de8 96.8%, #1c91eb 100.0%);
background: linear-gradient(90deg in oklch, oklch(18.90% 0.0661 268.59) 0.0%, oklch(19.54% 0.0688 268.45) 3.2%, oklch(20.39% 0.0723 268.28) 6.5%, oklch(21.39% 0.0765 268.07) 9.7%, oklch(22.51% 0.0812 267.83) 12.9%, oklch(23.72% 0.0861 267.55) 16.1%, oklch(24.98% 0.0911 267.21) 19.4%, oklch(26.24% 0.0959 266.82) 22.6%, oklch(27.47% 0.1003 266.36) 25.8%, oklch(28.72% 0.1046 265.80) 29.0%, oklch(30.02% 0.1090 265.15) 32.3%, oklch(31.36% 0.1134 264.43) 35.5%, oklch(32.73% 0.1177 263.69) 38.7%, oklch(34.14% 0.1220 262.93) 41.9%, oklch(35.58% 0.1262 262.20) 45.2%, oklch(37.05% 0.1303 261.51) 48.4%, oklch(38.55% 0.1343 260.90) 51.6%, oklch(40.09% 0.1383 260.38) 54.8%, oklch(41.67% 0.1424 259.90) 58.1%, oklch(43.29% 0.1463 259.45) 61.3%, oklch(44.93% 0.1501 258.99) 64.5%, oklch(46.59% 0.1536 258.47) 67.7%, oklch(48.27% 0.1567 257.88) 71.0%, oklch(49.97% 0.1593 257.17) 74.2%, oklch(51.74% 0.1613 256.28) 77.4%, oklch(53.70% 0.1627 255.18) 80.6%, oklch(55.76% 0.1637 253.94) 83.9%, oklch(57.82% 0.1643 252.64) 87.1%, oklch(59.79% 0.1646 251.37) 90.3%, oklch(61.57% 0.1649 250.20) 93.5%, oklch(63.06% 0.1651 249.22) 96.8%, oklch(64.17% 0.1654 248.52) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.189 | 0.066 | 268.6 |
| 2 | 0.272 | 0.099 | 266.5 |
| 3 | 0.378 | 0.132 | 261.2 |
| 4 | 0.504 | 0.16 | 257 |
| 5 | 0.642 | 0.165 | 248.5 |

## In these collections

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

## Other forms

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