# Near-black and blue metallic palette

The Near-black and blue metallic palette brings together dark gray, blue, and off-white. The colors span a very broad lightness range, combining restrained color with high contrast. Its balanced and composed character suits brand mood boards and editorial graphics. Its darkest tone is dark gray, and its lightest tone is off-white.

- Also called: Seamless navy, gray and blue linear gradient
- Seed: `kWMw-uRg6__YFv_Jjr_nQe_4`
- Page: https://grabient.com/kWMw-uRg6__YFv_Jjr_nQe_4?steps=32
- Drawn as: linear gradient, 32 steps, 90 degrees
- Kinds: light center, neutral, cool, seamless
- Hues: monochromatic
- Contrast of its darkest and lightest colors: 14.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 | `#0e171f` | `oklch(20.08% 0.0207 244.69)` | Black Stallion | white, 18 to 1 |
| 2 | `#141e27` | `oklch(22.87% 0.0225 244.69)` | Coarse Wool | white, 16.9 to 1 |
| 3 | `#1b2731` | `oklch(26.56% 0.0254 244.69)` | Abyssal Anchorfish Blue | white, 15.2 to 1 |
| 4 | `#24323e` | `oklch(30.97% 0.0288 244.69)` | Blue-Black | white, 13.1 to 1 |
| 5 | `#2e3f4d` | `oklch(35.87% 0.0323 244.69)` | Deepsea Core | white, 10.8 to 1 |
| 6 | `#3a4d5d` | `oklch(41.06% 0.0356 244.69)` | Cello | white, 8.7 to 1 |
| 7 | `#475c6d` | `oklch(46.33% 0.0382 244.69)` | Seven Seas | white, 6.9 to 1 |
| 8 | `#546a7d` | `oklch(51.47% 0.0398 244.69)` | Fern Flower | white, 5.6 to 1 |
| 9 | `#62788c` | `oklch(56.33% 0.0398 244.69)` | Mahonia Berry Blue | black, 4.6 to 1 |
| 10 | `#73899b` | `oklch(61.85% 0.0379 244.69)` | Somnambulist | black, 5.7 to 1 |
| 11 | `#879bad` | `oklch(68.07% 0.0345 244.69)` | Tsunami | black, 7.3 to 1 |
| 12 | `#9dafbf` | `oklch(74.49% 0.0301 244.69)` | Lost in Time | black, 9.3 to 1 |
| 13 | `#b3c2cf` | `oklch(80.64% 0.0255 244.69)` | Hazy | black, 11.5 to 1 |
| 14 | `#c6d3de` | `oklch(86.02% 0.0210 244.69)` | Velvet Sky | black, 13.7 to 1 |
| 15 | `#d5e0ea` | `oklch(90.14% 0.0175 244.69)` | Beyond the Wall | black, 15.6 to 1 |
| 16 | `#dee8f0` | `oklch(92.53% 0.0154 244.69)` | St. Petersburg | black, 16.8 to 1 |
| 17 | `#dfe8f1` | `oklch(92.71% 0.0154 244.69)` | St. Petersburg | black, 16.9 to 1 |
| 18 | `#d7e2eb` | `oklch(90.72% 0.0175 244.69)` | Pale Grey Blue | black, 15.9 to 1 |
| 19 | `#c9d6e1` | `oklch(87.00% 0.0210 244.69)` | Yeti Footprint | black, 14.2 to 1 |
| 20 | `#b7c6d4` | `oklch(82.04% 0.0255 244.69)` | Stargate | black, 12 to 1 |
| 21 | `#a3b5c4` | `oklch(76.29% 0.0301 244.69)` | Suds | black, 9.9 to 1 |
| 22 | `#8ea2b4` | `oklch(70.23% 0.0345 244.69)` | Canary Wharf | black, 7.9 to 1 |
| 23 | `#7a90a3` | `oklch(64.32% 0.0379 244.69)` | Jean Jacket Blue | black, 6.3 to 1 |
| 24 | `#6a8094` | `oklch(59.04% 0.0398 244.69)` | Grey Blueberry | black, 5.1 to 1 |
| 25 | `#5c7386` | `oklch(54.33% 0.0398 244.69)` | Plumbeous | white, 4.9 to 1 |
| 26 | `#4f6476` | `oklch(49.27% 0.0382 244.69)` | Prairie Denim | white, 6.1 to 1 |
| 27 | `#425565` | `oklch(44.02% 0.0356 244.69)` | Alien | white, 7.7 to 1 |
| 28 | `#364755` | `oklch(38.80% 0.0323 244.69)` | Surf’n’dive | white, 9.6 to 1 |
| 29 | `#2b3946` | `oklch(33.85% 0.0288 244.69)` | Adept | white, 11.7 to 1 |
| 30 | `#222e38` | `oklch(29.39% 0.0254 244.69)` | Freinacht Black | white, 13.8 to 1 |
| 31 | `#1a242d` | `oklch(25.64% 0.0225 244.69)` | Dark | white, 15.6 to 1 |
| 32 | `#141e26` | `oklch(22.83% 0.0207 244.69)` | Coarse Wool | white, 16.9 to 1 |

## CSS

```css
background: linear-gradient(90deg, #0e171f 0.0%, #141e27 3.2%, #1b2731 6.5%, #24323e 9.7%, #2e3f4d 12.9%, #3a4d5d 16.1%, #475c6d 19.4%, #546a7d 22.6%, #62788c 25.8%, #73899b 29.0%, #879bad 32.3%, #9dafbf 35.5%, #b3c2cf 38.7%, #c6d3de 41.9%, #d5e0ea 45.2%, #dee8f0 48.4%, #dfe8f1 51.6%, #d7e2eb 54.8%, #c9d6e1 58.1%, #b7c6d4 61.3%, #a3b5c4 64.5%, #8ea2b4 67.7%, #7a90a3 71.0%, #6a8094 74.2%, #5c7386 77.4%, #4f6476 80.6%, #425565 83.9%, #364755 87.1%, #2b3946 90.3%, #222e38 93.5%, #1a242d 96.8%, #141e26 100.0%);
background: linear-gradient(90deg in oklch, oklch(20.08% 0.0207 244.69) 0.0%, oklch(22.87% 0.0225 244.69) 3.2%, oklch(26.56% 0.0254 244.69) 6.5%, oklch(30.97% 0.0288 244.69) 9.7%, oklch(35.87% 0.0323 244.69) 12.9%, oklch(41.06% 0.0356 244.69) 16.1%, oklch(46.33% 0.0382 244.69) 19.4%, oklch(51.47% 0.0398 244.69) 22.6%, oklch(56.33% 0.0398 244.69) 25.8%, oklch(61.85% 0.0379 244.69) 29.0%, oklch(68.07% 0.0345 244.69) 32.3%, oklch(74.49% 0.0301 244.69) 35.5%, oklch(80.64% 0.0255 244.69) 38.7%, oklch(86.02% 0.0210 244.69) 41.9%, oklch(90.14% 0.0175 244.69) 45.2%, oklch(92.53% 0.0154 244.69) 48.4%, oklch(92.71% 0.0154 244.69) 51.6%, oklch(90.72% 0.0175 244.69) 54.8%, oklch(87.00% 0.0210 244.69) 58.1%, oklch(82.04% 0.0255 244.69) 61.3%, oklch(76.29% 0.0301 244.69) 64.5%, oklch(70.23% 0.0345 244.69) 67.7%, oklch(64.32% 0.0379 244.69) 71.0%, oklch(59.04% 0.0398 244.69) 74.2%, oklch(54.33% 0.0398 244.69) 77.4%, oklch(49.27% 0.0382 244.69) 80.6%, oklch(44.02% 0.0356 244.69) 83.9%, oklch(38.80% 0.0323 244.69) 87.1%, oklch(33.85% 0.0288 244.69) 90.3%, oklch(29.39% 0.0254 244.69) 93.5%, oklch(25.64% 0.0225 244.69) 96.8%, oklch(22.83% 0.0207 244.69) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.201 | 0.021 | 244.7 |
| 2 | 0.551 | 0.04 | 244.7 |
| 3 | 0.929 | 0.015 | 244.7 |
| 4 | 0.579 | 0.04 | 244.7 |
| 5 | 0.228 | 0.021 | 244.7 |

## In these collections

- [Metallic gradients](https://grabient.com/metallic-gradients)

## Other forms

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