# Dusty blue, stone and mauve glass palette

The Dusty blue, stone and mauve glass palette brings together dark purple, purple, light purple, off-white, light teal, and teal. The colors span a broad lightness range, combining restrained color with clear contrast. Its balanced and composed character suits brand mood boards and editorial graphics. Its darkest tone is dark purple, and its lightest tone is off-white.

- Also called: Navy, gray and dark gray angular gradient
- Seed: `kcSBLWM41AMiOv9jCUA94O1OaNP3HjsCLYvAg`
- Page: https://grabient.com/kcSBLWM41AMiOv9jCUA94O1OaNP3HjsCLYvAg?style=angularGradient&steps=32&angle=270
- Drawn as: angular gradient, 32 steps, 270 degrees
- Kinds: light center, neutral
- Hues: two-hue
- Contrast of its darkest and lightest colors: 12.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 | `#2c2734` | `oklch(28.35% 0.0248 300.94)` | Black Safflower | white, 14.5 to 1 |
| 2 | `#302b3a` | `oklch(30.19% 0.0267 301.33)` | Black Rock | white, 13.6 to 1 |
| 3 | `#373142` | `oklch(32.79% 0.0294 301.93)` | Oil Rush | white, 12.4 to 1 |
| 4 | `#40394b` | `oklch(35.86% 0.0324 302.53)` | Wineshade | white, 11 to 1 |
| 5 | `#494155` | `oklch(39.15% 0.0350 302.96)` | Royal Treatment | white, 9.6 to 1 |
| 6 | `#524a5f` | `oklch(42.44% 0.0368 303.05)` | Mata Hari | white, 8.4 to 1 |
| 7 | `#5c536a` | `oklch(45.92% 0.0386 302.78)` | Arraign | white, 7.2 to 1 |
| 8 | `#665d75` | `oklch(49.63% 0.0399 302.38)` | Purple Passage | white, 6.1 to 1 |
| 9 | `#726881` | `oklch(53.55% 0.0405 302.05)` | Fujinezumi | white, 5.2 to 1 |
| 10 | `#7e748d` | `oklch(57.70% 0.0398 302.06)` | Batik Lilac | black, 4.7 to 1 |
| 11 | `#8c829a` | `oklch(62.28% 0.0374 304.61)` | Violet Vibes | black, 5.7 to 1 |
| 12 | `#9c91a6` | `oklch(67.19% 0.0339 308.43)` | Delectable | black, 6.9 to 1 |
| 13 | `#aba0b3` | `oklch(72.11% 0.0298 310.20)` | Grapeade | black, 8.4 to 1 |
| 14 | `#b7afc1` | `oklch(76.73% 0.0258 306.59)` | Virtuous Violet | black, 9.9 to 1 |
| 15 | `#c2bfcf` | `oklch(81.15% 0.0219 293.78)` | Gentleman’s Suit | black, 11.6 to 1 |
| 16 | `#ccd0dc` | `oklch(85.90% 0.0170 271.71)` | Multnomah Falls | black, 13.6 to 1 |
| 17 | `#d8e0e7` | `oklch(90.21% 0.0125 246.38)` | Harbour Light | black, 15.7 to 1 |
| 18 | `#e2eaed` | `oklch(93.22% 0.0097 223.98)` | Plaster Cast | black, 17.2 to 1 |
| 19 | `#e4edef` | `oklch(94.09% 0.0102 210.49)` | Breaker | black, 17.7 to 1 |
| 20 | `#dceaec` | `oklch(92.70% 0.0149 205.38)` | Tibetan Sky | black, 17 to 1 |
| 21 | `#cde2e4` | `oklch(89.68% 0.0221 205.20)` | Lens Flare Blue | black, 15.5 to 1 |
| 22 | `#bbd6da` | `oklch(85.68% 0.0296 207.27)` | Light Sky Chase | black, 13.7 to 1 |
| 23 | `#a9c9ce` | `oklch(81.32% 0.0353 208.95)` | Sky Chase | black, 11.9 to 1 |
| 24 | `#98bac0` | `oklch(76.62% 0.0382 209.42)` | Casual Day | black, 10.1 to 1 |
| 25 | `#86a9b0` | `oklch(71.05% 0.0398 210.54)` | Stormy Waters | black, 8.2 to 1 |
| 26 | `#73979e` | `oklch(65.12% 0.0403 212.02)` | Alexandrite Teal | black, 6.6 to 1 |
| 27 | `#63858d` | `oklch(59.34% 0.0402 213.53)` | Arctic | black, 5.2 to 1 |
| 28 | `#54757d` | `oklch(54.08% 0.0396 214.82)` | Blue Sage | white, 4.9 to 1 |
| 29 | `#47656d` | `oklch(48.68% 0.0379 216.17)` | Night Folly | white, 6.2 to 1 |
| 30 | `#3a565e` | `oklch(43.46% 0.0356 217.54)` | Kingfisher | white, 7.8 to 1 |
| 31 | `#304951` | `oklch(38.99% 0.0332 218.73)` | Dad’s Coupe | white, 9.4 to 1 |
| 32 | `#294148` | `oklch(35.83% 0.0317 219.57)` | Japanese Indigo | white, 10.8 to 1 |

## CSS

```css
background: conic-gradient(from 270deg, #2c2734 0.0%, #302b3a 3.2%, #373142 6.5%, #40394b 9.7%, #494155 12.9%, #524a5f 16.1%, #5c536a 19.4%, #665d75 22.6%, #726881 25.8%, #7e748d 29.0%, #8c829a 32.3%, #9c91a6 35.5%, #aba0b3 38.7%, #b7afc1 41.9%, #c2bfcf 45.2%, #ccd0dc 48.4%, #d8e0e7 51.6%, #e2eaed 54.8%, #e4edef 58.1%, #dceaec 61.3%, #cde2e4 64.5%, #bbd6da 67.7%, #a9c9ce 71.0%, #98bac0 74.2%, #86a9b0 77.4%, #73979e 80.6%, #63858d 83.9%, #54757d 87.1%, #47656d 90.3%, #3a565e 93.5%, #304951 96.8%, #294148 100.0%);
background: conic-gradient(from 270deg in oklch, oklch(28.35% 0.0248 300.94) 0.0%, oklch(30.19% 0.0267 301.33) 3.2%, oklch(32.79% 0.0294 301.93) 6.5%, oklch(35.86% 0.0324 302.53) 9.7%, oklch(39.15% 0.0350 302.96) 12.9%, oklch(42.44% 0.0368 303.05) 16.1%, oklch(45.92% 0.0386 302.78) 19.4%, oklch(49.63% 0.0399 302.38) 22.6%, oklch(53.55% 0.0405 302.05) 25.8%, oklch(57.70% 0.0398 302.06) 29.0%, oklch(62.28% 0.0374 304.61) 32.3%, oklch(67.19% 0.0339 308.43) 35.5%, oklch(72.11% 0.0298 310.20) 38.7%, oklch(76.73% 0.0258 306.59) 41.9%, oklch(81.15% 0.0219 293.78) 45.2%, oklch(85.90% 0.0170 271.71) 48.4%, oklch(90.21% 0.0125 246.38) 51.6%, oklch(93.22% 0.0097 223.98) 54.8%, oklch(94.09% 0.0102 210.49) 58.1%, oklch(92.70% 0.0149 205.38) 61.3%, oklch(89.68% 0.0221 205.20) 64.5%, oklch(85.68% 0.0296 207.27) 67.7%, oklch(81.32% 0.0353 208.95) 71.0%, oklch(76.62% 0.0382 209.42) 74.2%, oklch(71.05% 0.0398 210.54) 77.4%, oklch(65.12% 0.0403 212.02) 80.6%, oklch(59.34% 0.0402 213.53) 83.9%, oklch(54.08% 0.0396 214.82) 87.1%, oklch(48.68% 0.0379 216.17) 90.3%, oklch(43.46% 0.0356 217.54) 93.5%, oklch(38.99% 0.0332 218.73) 96.8%, oklch(35.83% 0.0317 219.57) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.283 | 0.025 | 300.9 |
| 2 | 0.406 | 0.036 | 303.1 |
| 3 | 0.571 | 0.04 | 302 |
| 4 | 0.78 | 0.025 | 304.1 |
| 5 | 0.941 | 0.01 | 213.2 |
| 6 | 0.807 | 0.036 | 209 |
| 7 | 0.563 | 0.04 | 214.3 |
| 8 | 0.358 | 0.032 | 219.6 |

## In these collections

- [Glass gradients](https://grabient.com/glass-gradients)

## Other forms

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