# Mauve frost blue diagonal haze

Purple, brown, blue and gray linear gradient with 48 colors: #23418a, #31408b, #413e8b, #503c88, #603a82, #6e3979, #7a396e, #833a62, #8b3d57, #90414f, #944649, #974b48, #9b4f4c, #9f5355, #a25763, #a55c74, #a66288, #a36a9d, #9c73b0, #927dc0, #8587cb, #7891d0, #6b99d1, #629fcf, #5ea1ca, #5da2c5, #5da1be, #609eb6, #629aae, #6596a7, #68919f, #6a8c98, #6b8791, #6d838c, #6d8087, #6e7e84, #6f7e83, #6f7e84, #6f7f85, #6f8088, #6f828b, #6e858f, #6e8793, #6d8997, #6d8b9b, #6d8d9f, #6d8fa2, #6d90a4. Edit it and copy or download CSS, SVG, PNG or shader code.

- Also called: Purple, brown, blue and gray linear gradient
- Seed: `kWZVy8QaVOFaiLvKB73UJJBQ`
- Page: https://grabient.com/kWZVy8QaVOFaiLvKB73UJJBQ?steps=48&angle=135
- Drawn as: linear gradient, 48 steps, 135 degrees
- Hues: wide
- Contrast of its darkest and lightest colors: 3.3 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 | `#23418a` | `oklch(39.76% 0.1268 264.38)` | Blue Oblivion | white, 9.5 to 1 |
| 2 | `#31408b` | `oklch(40.33% 0.1255 271.16)` | Blue Oblivion | white, 9.3 to 1 |
| 3 | `#413e8b` | `oklch(41.03% 0.1238 280.87)` | Clematis Blue | white, 9.1 to 1 |
| 4 | `#503c88` | `oklch(41.83% 0.1218 292.80)` | Blue Gem | white, 8.9 to 1 |
| 5 | `#603a82` | `oklch(42.73% 0.1195 306.24)` | Tillandsia Purple | white, 8.6 to 1 |
| 6 | `#6e3979` | `oklch(43.71% 0.1171 320.49)` | Comtesse | white, 8.3 to 1 |
| 7 | `#7a396e` | `oklch(44.77% 0.1146 334.84)` | Ayame Iris | white, 8 to 1 |
| 8 | `#833a62` | `oklch(45.89% 0.1120 348.58)` | Berry Patch | white, 7.6 to 1 |
| 9 | `#8b3d57` | `oklch(47.05% 0.1095 1.00)` | Quinacridone Magenta | white, 7.2 to 1 |
| 10 | `#90414f` | `oklch(48.24% 0.1072 11.40)` | Umemurasaki Purple | white, 6.8 to 1 |
| 11 | `#944649` | `oklch(49.45% 0.1050 19.07)` | Cowhide | white, 6.4 to 1 |
| 12 | `#974b48` | `oklch(50.67% 0.1031 23.30)` | Circus Red | white, 6.1 to 1 |
| 13 | `#9b4f4c` | `oklch(51.88% 0.1016 23.38)` | Sweet Cherry | white, 5.8 to 1 |
| 14 | `#9f5355` | `oklch(53.27% 0.1007 19.04)` | Bravado Red | white, 5.4 to 1 |
| 15 | `#a25763` | `oklch(54.84% 0.1003 10.87)` | Beef Jerky | white, 5.1 to 1 |
| 16 | `#a55c74` | `oklch(56.54% 0.1003 359.60)` | Cosmetic Red | white, 4.8 to 1 |
| 17 | `#a66288` | `oklch(58.31% 0.1005 345.94)` | Wild Mulberry | black, 4.7 to 1 |
| 18 | `#a36a9d` | `oklch(60.10% 0.1007 330.62)` | Violet Femmes | black, 5 to 1 |
| 19 | `#9c73b0` | `oklch(61.84% 0.1009 314.35)` | Purple Pride | black, 5.4 to 1 |
| 20 | `#927dc0` | `oklch(63.49% 0.1008 297.85)` | Royal Raul | black, 5.9 to 1 |
| 21 | `#8587cb` | `oklch(64.97% 0.1004 281.84)` | True Lavender | black, 6.3 to 1 |
| 22 | `#7891d0` | `oklch(66.25% 0.0994 267.05)` | Organza Violet | black, 6.7 to 1 |
| 23 | `#6b99d1` | `oklch(67.25% 0.0978 254.18)` | Sea Loch | black, 7 to 1 |
| 24 | `#629fcf` | `oklch(67.92% 0.0953 243.96)` | Picton Blue | black, 7.3 to 1 |
| 25 | `#5ea1ca` | `oklch(68.19% 0.0918 236.83)` | Sub-Zero | black, 7.4 to 1 |
| 26 | `#5da2c5` | `oklch(68.03% 0.0868 231.46)` | Scott Base | black, 7.4 to 1 |
| 27 | `#5da1be` | `oklch(67.49% 0.0806 227.43)` | Dupain | black, 7.2 to 1 |
| 28 | `#609eb6` | `oklch(66.65% 0.0735 224.56)` | Dolphin Daze | black, 7 to 1 |
| 29 | `#629aae` | `oklch(65.59% 0.0658 222.68)` | Pyjama Blue | black, 6.7 to 1 |
| 30 | `#6596a7` | `oklch(64.38% 0.0579 221.61)` | My Skiff | black, 6.4 to 1 |
| 31 | `#68919f` | `oklch(63.10% 0.0499 221.16)` | Secret Cove | black, 6.1 to 1 |
| 32 | `#6a8c98` | `oklch(61.83% 0.0423 221.17)` | Spirit Mountain | black, 5.8 to 1 |
| 33 | `#6b8791` | `oklch(60.64% 0.0353 221.45)` | Shoreline | black, 5.5 to 1 |
| 34 | `#6d838c` | `oklch(59.61% 0.0292 221.83)` | Indigo Mouse | black, 5.2 to 1 |
| 35 | `#6d8087` | `oklch(58.81% 0.0244 222.12)` | Atlantic Shoreline | black, 5.1 to 1 |
| 36 | `#6e7e84` | `oklch(58.33% 0.0212 222.16)` | Taliesin Blue | black, 5 to 1 |
| 37 | `#6f7e83` | `oklch(58.19% 0.0197 222.04)` | Taliesin Blue | black, 4.9 to 1 |
| 38 | `#6f7e84` | `oklch(58.27% 0.0198 222.35)` | Taliesin Blue | black, 4.9 to 1 |
| 39 | `#6f7f85` | `oklch(58.55% 0.0210 223.04)` | Taliesin Blue | black, 5 to 1 |
| 40 | `#6f8088` | `oklch(58.97% 0.0234 224.03)` | Atlantic Shoreline | black, 5.1 to 1 |
| 41 | `#6f828b` | `oklch(59.51% 0.0265 225.25)` | Polished Steel | black, 5.2 to 1 |
| 42 | `#6e858f` | `oklch(60.13% 0.0301 226.62)` | Blustery Sky | black, 5.3 to 1 |
| 43 | `#6e8793` | `oklch(60.79% 0.0340 228.06)` | Shoreline | black, 5.5 to 1 |
| 44 | `#6d8997` | `oklch(61.45% 0.0380 229.50)` | Jeans Indigo | black, 5.6 to 1 |
| 45 | `#6d8b9b` | `oklch(62.08% 0.0418 230.87)` | China Clay | black, 5.8 to 1 |
| 46 | `#6d8d9f` | `oklch(62.63% 0.0452 232.08)` | Bermuda Triangle | black, 5.9 to 1 |
| 47 | `#6d8fa2` | `oklch(63.08% 0.0478 233.06)` | French Court | black, 6 to 1 |
| 48 | `#6d90a4` | `oklch(63.39% 0.0496 233.73)` | French Court | black, 6.1 to 1 |

## CSS

```css
background: linear-gradient(135deg, #23418a 0.0%, #31408b 2.1%, #413e8b 4.3%, #503c88 6.4%, #603a82 8.5%, #6e3979 10.6%, #7a396e 12.8%, #833a62 14.9%, #8b3d57 17.0%, #90414f 19.1%, #944649 21.3%, #974b48 23.4%, #9b4f4c 25.5%, #9f5355 27.7%, #a25763 29.8%, #a55c74 31.9%, #a66288 34.0%, #a36a9d 36.2%, #9c73b0 38.3%, #927dc0 40.4%, #8587cb 42.6%, #7891d0 44.7%, #6b99d1 46.8%, #629fcf 48.9%, #5ea1ca 51.1%, #5da2c5 53.2%, #5da1be 55.3%, #609eb6 57.4%, #629aae 59.6%, #6596a7 61.7%, #68919f 63.8%, #6a8c98 66.0%, #6b8791 68.1%, #6d838c 70.2%, #6d8087 72.3%, #6e7e84 74.5%, #6f7e83 76.6%, #6f7e84 78.7%, #6f7f85 80.9%, #6f8088 83.0%, #6f828b 85.1%, #6e858f 87.2%, #6e8793 89.4%, #6d8997 91.5%, #6d8b9b 93.6%, #6d8d9f 95.7%, #6d8fa2 97.9%, #6d90a4 100.0%);
background: linear-gradient(135deg in oklch, oklch(39.76% 0.1268 264.38) 0.0%, oklch(40.33% 0.1255 271.16) 2.1%, oklch(41.03% 0.1238 280.87) 4.3%, oklch(41.83% 0.1218 292.80) 6.4%, oklch(42.73% 0.1195 306.24) 8.5%, oklch(43.71% 0.1171 320.49) 10.6%, oklch(44.77% 0.1146 334.84) 12.8%, oklch(45.89% 0.1120 348.58) 14.9%, oklch(47.05% 0.1095 1.00) 17.0%, oklch(48.24% 0.1072 11.40) 19.1%, oklch(49.45% 0.1050 19.07) 21.3%, oklch(50.67% 0.1031 23.30) 23.4%, oklch(51.88% 0.1016 23.38) 25.5%, oklch(53.27% 0.1007 19.04) 27.7%, oklch(54.84% 0.1003 10.87) 29.8%, oklch(56.54% 0.1003 359.60) 31.9%, oklch(58.31% 0.1005 345.94) 34.0%, oklch(60.10% 0.1007 330.62) 36.2%, oklch(61.84% 0.1009 314.35) 38.3%, oklch(63.49% 0.1008 297.85) 40.4%, oklch(64.97% 0.1004 281.84) 42.6%, oklch(66.25% 0.0994 267.05) 44.7%, oklch(67.25% 0.0978 254.18) 46.8%, oklch(67.92% 0.0953 243.96) 48.9%, oklch(68.19% 0.0918 236.83) 51.1%, oklch(68.03% 0.0868 231.46) 53.2%, oklch(67.49% 0.0806 227.43) 55.3%, oklch(66.65% 0.0735 224.56) 57.4%, oklch(65.59% 0.0658 222.68) 59.6%, oklch(64.38% 0.0579 221.61) 61.7%, oklch(63.10% 0.0499 221.16) 63.8%, oklch(61.83% 0.0423 221.17) 66.0%, oklch(60.64% 0.0353 221.45) 68.1%, oklch(59.61% 0.0292 221.83) 70.2%, oklch(58.81% 0.0244 222.12) 72.3%, oklch(58.33% 0.0212 222.16) 74.5%, oklch(58.19% 0.0197 222.04) 76.6%, oklch(58.27% 0.0198 222.35) 78.7%, oklch(58.55% 0.0210 223.04) 80.9%, oklch(58.97% 0.0234 224.03) 83.0%, oklch(59.51% 0.0265 225.25) 85.1%, oklch(60.13% 0.0301 226.62) 87.2%, oklch(60.79% 0.0340 228.06) 89.4%, oklch(61.45% 0.0380 229.50) 91.5%, oklch(62.08% 0.0418 230.87) 93.6%, oklch(62.63% 0.0452 232.08) 95.7%, oklch(63.08% 0.0478 233.06) 97.9%, oklch(63.39% 0.0496 233.73) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.398 | 0.127 | 264.4 |
| 2 | 0.516 | 0.102 | 383.8 |
| 3 | 0.681 | 0.094 | 240.1 |
| 4 | 0.583 | 0.021 | 222.1 |
| 5 | 0.634 | 0.05 | 233.7 |

## In these collections

- [Snow gum blue hour](https://grabient.com/snow-gum-blue-hour)

## Other forms

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