# Mauve and charcoal color palette The Mauve and charcoal color palette brings together magenta, gray, and dark gray. The colors span a moderate lightness range, combining restrained color with gentle contrast. Its balanced and composed character suits editorial layouts and period-inspired packaging. Its darkest tone is dark gray, and its lightest tone is magenta. - Also called: Dark purple, purple, gray and black linear gradient - Seed: `kWVif2PhdAU4Uv65ib1JIM5I` - Page: https://grabient.com/kWVif2PhdAU4Uv65ib1JIM5I?steps=32 - Drawn as: linear gradient, 32 steps, 90 degrees - Kinds: light center, muted, monochrome - Hues: analogous - Contrast of its darkest and lightest colors: 3.7 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 | `#4c2c3d` | `oklch(33.86% 0.0537 345.94)` | Ripe Eggplant | white, 12.1 to 1 | | 2 | `#4f2f41` | `oklch(35.07% 0.0546 346.23)` | Potent Purple | white, 11.5 to 1 | | 3 | `#543345` | `oklch(36.71% 0.0560 346.66)` | Blackberry Tart | white, 10.8 to 1 | | 4 | `#5b374a` | `oklch(38.67% 0.0575 347.18)` | Dulcet Violet | white, 10 to 1 | | 5 | `#623c50` | `oklch(40.83% 0.0592 347.72)` | Dark Potion | white, 9.1 to 1 | | 6 | `#694256` | `oklch(43.08% 0.0608 348.24)` | Delicious Berry | white, 8.3 to 1 | | 7 | `#70485c` | `oklch(45.31% 0.0621 348.69)` | Prussian Plum | white, 7.6 to 1 | | 8 | `#774d62` | `oklch(47.40% 0.0631 349.00)` | Red Endive | white, 6.9 to 1 | | 9 | `#7d5267` | `oklch(49.28% 0.0634 349.13)` | Passive Royal | white, 6.4 to 1 | | 10 | `#83586c` | `oklch(51.30% 0.0635 349.29)` | Tulipwood | white, 5.8 to 1 | | 11 | `#8a5e73` | `oklch(53.51% 0.0633 349.48)` | Grape Nectar | white, 5.3 to 1 | | 12 | `#906579` | `oklch(55.74% 0.0629 349.62)` | Sweet Violet | white, 4.8 to 1 | | 13 | `#966b7f` | `oklch(57.81% 0.0621 349.61)` | Strikemaster | black, 4.7 to 1 | | 14 | `#9b7084` | `oklch(59.56% 0.0610 349.35)` | Meadow Flower | black, 5 to 1 | | 15 | `#9e7488` | `oklch(60.82% 0.0596 348.75)` | Upper Crust | black, 5.3 to 1 | | 16 | `#9f778b` | `oklch(61.42% 0.0576 347.71)` | Upper Crust | black, 5.4 to 1 | | 17 | `#9d778b` | `oklch(61.19% 0.0552 346.20)` | Mountbatten Pink | black, 5.4 to 1 | | 18 | `#987488` | `oklch(60.11% 0.0519 344.49)` | Artiste | black, 5.2 to 1 | | 19 | `#907083` | `oklch(58.35% 0.0480 342.55)` | Magic Gem | black, 4.8 to 1 | | 20 | `#876b7d` | `oklch(56.10% 0.0437 340.29)` | Plum Royale | white, 4.7 to 1 | | 21 | `#7d6575` | `oklch(53.54% 0.0392 337.60)` | Cabal | white, 5.2 to 1 | | 22 | `#735e6e` | `oklch(50.85% 0.0348 334.40)` | Banished Brown | white, 5.8 to 1 | | 23 | `#695866` | `oklch(48.21% 0.0306 330.58)` | Patina Violet | white, 6.5 to 1 | | 24 | `#605360` | `oklch(45.82% 0.0270 326.06)` | Purple Trinket | white, 7.2 to 1 | | 25 | `#584d5a` | `oklch(43.62% 0.0239 320.42)` | Purple Fury | white, 7.9 to 1 | | 26 | `#4f4853` | `oklch(41.24% 0.0209 313.15)` | Tol Barad Grey | white, 8.8 to 1 | | 27 | `#46424c` | `oklch(38.77% 0.0182 304.81)` | Nine Iron | white, 9.7 to 1 | | 28 | `#3e3c45` | `oklch(36.30% 0.0156 295.99)` | Tuxedo | white, 10.7 to 1 | | 29 | `#37373f` | `oklch(33.96% 0.0133 287.28)` | Black Marlin | white, 11.8 to 1 | | 30 | `#313238` | `oklch(31.84% 0.0113 279.27)` | Granite Black | white, 12.7 to 1 | | 31 | `#2c2e33` | `oklch(30.07% 0.0096 272.56)` | Stretch Limo | white, 13.6 to 1 | | 32 | `#292b2f` | `oklch(28.74% 0.0083 267.74)` | Bunker | white, 14.2 to 1 | ## CSS ```css background: linear-gradient(90deg, #4c2c3d 0.0%, #4f2f41 3.2%, #543345 6.5%, #5b374a 9.7%, #623c50 12.9%, #694256 16.1%, #70485c 19.4%, #774d62 22.6%, #7d5267 25.8%, #83586c 29.0%, #8a5e73 32.3%, #906579 35.5%, #966b7f 38.7%, #9b7084 41.9%, #9e7488 45.2%, #9f778b 48.4%, #9d778b 51.6%, #987488 54.8%, #907083 58.1%, #876b7d 61.3%, #7d6575 64.5%, #735e6e 67.7%, #695866 71.0%, #605360 74.2%, #584d5a 77.4%, #4f4853 80.6%, #46424c 83.9%, #3e3c45 87.1%, #37373f 90.3%, #313238 93.5%, #2c2e33 96.8%, #292b2f 100.0%); background: linear-gradient(90deg in oklch, oklch(33.86% 0.0537 345.94) 0.0%, oklch(35.07% 0.0546 346.23) 3.2%, oklch(36.71% 0.0560 346.66) 6.5%, oklch(38.67% 0.0575 347.18) 9.7%, oklch(40.83% 0.0592 347.72) 12.9%, oklch(43.08% 0.0608 348.24) 16.1%, oklch(45.31% 0.0621 348.69) 19.4%, oklch(47.40% 0.0631 349.00) 22.6%, oklch(49.28% 0.0634 349.13) 25.8%, oklch(51.30% 0.0635 349.29) 29.0%, oklch(53.51% 0.0633 349.48) 32.3%, oklch(55.74% 0.0629 349.62) 35.5%, oklch(57.81% 0.0621 349.61) 38.7%, oklch(59.56% 0.0610 349.35) 41.9%, oklch(60.82% 0.0596 348.75) 45.2%, oklch(61.42% 0.0576 347.71) 48.4%, oklch(61.19% 0.0552 346.20) 51.6%, oklch(60.11% 0.0519 344.49) 54.8%, oklch(58.35% 0.0480 342.55) 58.1%, oklch(56.10% 0.0437 340.29) 61.3%, oklch(53.54% 0.0392 337.60) 64.5%, oklch(50.85% 0.0348 334.40) 67.7%, oklch(48.21% 0.0306 330.58) 71.0%, oklch(45.82% 0.0270 326.06) 74.2%, oklch(43.62% 0.0239 320.42) 77.4%, oklch(41.24% 0.0209 313.15) 80.6%, oklch(38.77% 0.0182 304.81) 83.9%, oklch(36.30% 0.0156 295.99) 87.1%, oklch(33.96% 0.0133 287.28) 90.3%, oklch(31.84% 0.0113 279.27) 93.5%, oklch(30.07% 0.0096 272.56) 96.8%, oklch(28.74% 0.0083 267.74) 100.0%); ``` ## Keyframes 5 OKLCH keyframes joined by a Catmull-Rom spline. Hue is unwrapped degrees. | Keyframe | Lightness | Chroma | Hue | | --- | --- | --- | --- | | 1 | 0.339 | 0.054 | 345.9 | | 2 | 0.488 | 0.063 | 349.1 | | 3 | 0.614 | 0.056 | 347 | | 4 | 0.453 | 0.026 | 324.8 | | 5 | 0.287 | 0.008 | 267.7 | ## In these collections - [Moody gradients](https://grabient.com/moody-gradients) - [Vintage gradients](https://grabient.com/vintage-gradients) ## Other forms - [JSON](https://grabient.com/kWVif2PhdAU4Uv65ib1JIM5I.json?steps=32) - [PNG](https://grabient.com/kWVif2PhdAU4Uv65ib1JIM5I.png?steps=32) - [SVG](https://grabient.com/kWVif2PhdAU4Uv65ib1JIM5I.svg?steps=32) - [CSS](https://grabient.com/kWVif2PhdAU4Uv65ib1JIM5I.css?steps=32) - [ASE](https://grabient.com/kWVif2PhdAU4Uv65ib1JIM5I.ase?steps=32) - [GPL](https://grabient.com/kWVif2PhdAU4Uv65ib1JIM5I.gpl?steps=32) - [GRD](https://grabient.com/kWVif2PhdAU4Uv65ib1JIM5I.grd?steps=32) - [Design tokens](https://grabient.com/kWVif2PhdAU4Uv65ib1JIM5I.tokens.json?steps=32) - [Social card](https://grabient.com/api/og?seed=kWVif2PhdAU4Uv65ib1JIM5I&steps=32) - [Palettes like this one](https://grabient.com/palettes?q=kWVif2PhdAU4Uv65ib1JIM5I) - [Guide for agents](https://grabient.com/llms.txt)