# Monochrome gray and blue linear swatches

Monochrome gray and blue linear swatches with 21 colors: #3e535e, #3d515e, #3c4e5d, #3b4c5f, #3c4c64, #3f4d6c, #435075, #495480, #515a8c, #596198, #6169a4, #6a71ae, #727bb7, #7b84bf, #838dc2, #8f94c0, #969dbd, #96a5bb, #96acb5, #9eb0ab, #a6b0a8. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kabRekNA7CzkZwfEocCUR-_1qOvtfBjIA`
- Page: https://grabient.com/kabRekNA7CzkZwfEocCUR-_1qOvtfBjIA?style=linearSwatches&steps=21&angle=135
- Drawn as: linear swatches, 21 steps, 135 degrees
- Kinds: dark to light, muted, cool, monochrome
- Hues: monochromatic
- Contrast of its darkest and lightest colors: 3.9 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 | `#3e535e` | `oklch(42.91% 0.0317 230.62)` | Slate Wall | white, 8 to 1 |
| 2 | `#3d515e` | `oklch(42.28% 0.0329 236.36)` | Midnight Haze | white, 8.2 to 1 |
| 3 | `#3c4e5d` | `oklch(41.40% 0.0347 244.57)` | Cello | white, 8.6 to 1 |
| 4 | `#3b4c5f` | `oklch(40.91% 0.0382 252.69)` | Man Friday | white, 8.8 to 1 |
| 5 | `#3c4c64` | `oklch(41.27% 0.0447 258.97)` | Master | white, 8.7 to 1 |
| 6 | `#3f4d6c` | `oklch(42.22% 0.0543 264.57)` | Blackberry Cobbler | white, 8.4 to 1 |
| 7 | `#435075` | `oklch(43.67% 0.0644 269.32)` | Astronaut | white, 7.9 to 1 |
| 8 | `#495480` | `oklch(45.58% 0.0729 272.87)` | Mozart | white, 7.3 to 1 |
| 9 | `#515a8c` | `oklch(48.10% 0.0810 275.09)` | Wild Elderberry | white, 6.6 to 1 |
| 10 | `#596198` | `oklch(51.00% 0.0880 276.37)` | Wizard’s Potion | white, 5.8 to 1 |
| 11 | `#6169a4` | `oklch(53.94% 0.0923 277.12)` | Twinkle Night | white, 5.1 to 1 |
| 12 | `#6a71ae` | `oklch(56.91% 0.0940 277.54)` | Chalcedony Violet | black, 4.5 to 1 |
| 13 | `#727bb7` | `oklch(59.97% 0.0933 277.40)` | Persian Jewel | black, 5.2 to 1 |
| 14 | `#7b84bf` | `oklch(62.89% 0.0892 276.54)` | Deep Periwinkle | black, 5.8 to 1 |
| 15 | `#838dc2` | `oklch(65.49% 0.0797 276.43)` | Pleated Mauve | black, 6.5 to 1 |
| 16 | `#8f94c0` | `oklch(67.91% 0.0645 278.58)` | Velvet Crest | black, 7.1 to 1 |
| 17 | `#969dbd` | `oklch(70.05% 0.0485 275.49)` | Midnight Blush | black, 7.8 to 1 |
| 18 | `#96a5bb` | `oklch(71.79% 0.0366 258.66)` | Zen Blue | black, 8.4 to 1 |
| 19 | `#96acb5` | `oklch(73.13% 0.0278 221.77)` | Pacific Bliss | black, 8.8 to 1 |
| 20 | `#9eb0ab` | `oklch(74.12% 0.0211 179.22)` | Grey Morning | black, 9.2 to 1 |
| 21 | `#a6b0a8` | `oklch(74.80% 0.0165 149.26)` | Dreamcatcher | black, 9.4 to 1 |

## CSS

```css
background: linear-gradient(135deg, #3e535e 0.000% 4.762%, #3d515e 4.762% 9.524%, #3c4e5d 9.524% 14.286%, #3b4c5f 14.286% 19.048%, #3c4c64 19.048% 23.810%, #3f4d6c 23.810% 28.571%, #435075 28.571% 33.333%, #495480 33.333% 38.095%, #515a8c 38.095% 42.857%, #596198 42.857% 47.619%, #6169a4 47.619% 52.381%, #6a71ae 52.381% 57.143%, #727bb7 57.143% 61.905%, #7b84bf 61.905% 66.667%, #838dc2 66.667% 71.429%, #8f94c0 71.429% 76.190%, #969dbd 76.190% 80.952%, #96a5bb 80.952% 85.714%, #96acb5 85.714% 90.476%, #9eb0ab 90.476% 95.238%, #a6b0a8 95.238% 100.000%);
background: linear-gradient(135deg, oklch(42.91% 0.0317 230.62) 0.000% 4.762%, oklch(42.28% 0.0329 236.36) 4.762% 9.524%, oklch(41.40% 0.0347 244.57) 9.524% 14.286%, oklch(40.91% 0.0382 252.69) 14.286% 19.048%, oklch(41.27% 0.0447 258.97) 19.048% 23.810%, oklch(42.22% 0.0543 264.57) 23.810% 28.571%, oklch(43.67% 0.0644 269.32) 28.571% 33.333%, oklch(45.58% 0.0729 272.87) 33.333% 38.095%, oklch(48.10% 0.0810 275.09) 38.095% 42.857%, oklch(51.00% 0.0880 276.37) 42.857% 47.619%, oklch(53.94% 0.0923 277.12) 47.619% 52.381%, oklch(56.91% 0.0940 277.54) 52.381% 57.143%, oklch(59.97% 0.0933 277.40) 57.143% 61.905%, oklch(62.89% 0.0892 276.54) 61.905% 66.667%, oklch(65.49% 0.0797 276.43) 66.667% 71.429%, oklch(67.91% 0.0645 278.58) 71.429% 76.190%, oklch(70.05% 0.0485 275.49) 76.190% 80.952%, oklch(71.79% 0.0366 258.66) 80.952% 85.714%, oklch(73.13% 0.0278 221.77) 85.714% 90.476%, oklch(74.12% 0.0211 179.22) 90.476% 95.238%, oklch(74.80% 0.0165 149.26) 95.238% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.429 | 0.032 | 230.6 |
| 2 | 0.409 | 0.04 | 254.9 |
| 3 | 0.449 | 0.07 | 271.8 |
| 4 | 0.539 | 0.092 | 277.1 |
| 5 | 0.638 | 0.087 | 276.1 |
| 6 | 0.713 | 0.04 | 266.6 |
| 7 | 0.748 | 0.017 | 149.3 |

## In these collections

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

## Other forms

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