Glossy Black to Fire color palette
100415Glossy Black2C07003AM Breakup4B161AMinotaur Hide383053Midnight Pie663A88Lords of the Night913821Fire
About this palette
Glossy Black to Fire is a 6-color dark palette: #100415 (Glossy Black), #2C0700 (3AM Breakup), #4B161A (Minotaur Hide), #383053 (Midnight Pie), #663A88 (Lords of the Night), #913821 (Fire). It mixes black, brown, purple, red tones and feels balanced overall. The strongest text pairing is #100415 on #913821 with a contrast ratio of 2.66:1, and 0 of its 15 color pairs pass WCAG AA for normal text.
Color codes
| Color | HEX | RGB | HSL |
|---|---|---|---|
| Glossy Black | rgb(16, 4, 21) | hsl(282, 68%, 5%) | |
| 3AM Breakup | rgb(44, 7, 0) | hsl(10, 100%, 9%) | |
| Minotaur Hide | rgb(75, 22, 26) | hsl(355, 55%, 19%) | |
| Midnight Pie | rgb(56, 48, 83) | hsl(254, 27%, 26%) | |
| Lords of the Night | rgb(102, 58, 136) | hsl(274, 40%, 38%) | |
| Fire | rgb(145, 56, 33) | hsl(12, 63%, 35%) |
Accessible color pairs
Pairs with at least 3:1 contrast (large text and UI components); 4.5:1 or more passes WCAG AA for body text.
Color blindness preview
- Protanopia
- Deuteranopia
- Tritanopia
- Achromatopsia
- Dog vision
CSS variables
/* Glossy Black to Fire — https://swatchly.xyz/palette/100415-2c0700-4b161a-383053-663a88-913821 */
:root {
--glossy-black: #100415;
--c-3am-breakup: #2c0700;
--minotaur-hide: #4b161a;
--midnight-pie: #383053;
--lords-of-the-night: #663a88;
--fire: #913821;
}
Tailwind CSS v4
/* Glossy Black to Fire — https://swatchly.xyz/palette/100415-2c0700-4b161a-383053-663a88-913821 */
@theme {
--color-glossy-black: #100415;
--color-glossy-black-50: #fbf1ff;
--color-glossy-black-100: #f2e6f7;
--color-glossy-black-200: #e0d1e6;
--color-glossy-black-300: #cabad1;
--color-glossy-black-400: #ac9ab3;
--color-glossy-black-500: #8c7a93;
--color-glossy-black-600: #6c5b73;
--color-glossy-black-700: #504256;
--color-glossy-black-800: #382d3c;
--color-glossy-black-900: #231b27;
--color-glossy-black-950: #100415;
--color-c-3am-breakup: #2c0700;
--color-c-3am-breakup-50: #fff2ee;
--color-c-3am-breakup-100: #ffe5dc;
--color-c-3am-breakup-200: #f5cdc1;
--color-c-3am-breakup-300: #e2b5a8;
--color-c-3am-breakup-400: #c49586;
--color-c-3am-breakup-500: #a67768;
--color-c-3am-breakup-600: #885b4d;
--color-c-3am-breakup-700: #6b4438;
--color-c-3am-breakup-800: #523127;
--color-c-3am-breakup-900: #3c221a;
--color-c-3am-breakup-950: #2c0700;
--color-minotaur-hide: #4b161a;
--color-minotaur-hide-50: #fff1f1;
--color-minotaur-hide-100: #ffe4e3;
--color-minotaur-hide-200: #fdc9c8;
--color-minotaur-hide-300: #eab0af;
--color-minotaur-hide-400: #cc8d8c;
--color-minotaur-hide-500: #ae6f6f;
--color-minotaur-hide-600: #8f5455;
--color-minotaur-hide-700: #723e3f;
--color-minotaur-hide-800: #582d2e;
--color-minotaur-hide-900: #4b161a;
--color-minotaur-hide-950: #291111;
--color-midnight-pie: #383053;
--color-midnight-pie-50: #f5f3ff;
--color-midnight-pie-100: #ece8ff;
--color-midnight-pie-200: #d8d2f3;
--color-midnight-pie-300: #c2bbe0;
--color-midnight-pie-400: #a39cc4;
--color-midnight-pie-500: #8981aa;
--color-midnight-pie-600: #6f678e;
--color-midnight-pie-700: #595275;
--color-midnight-pie-800: #47405f;
--color-midnight-pie-900: #383053;
--color-midnight-pie-950: #231f32;
--color-lords-of-the-night: #663a88;
--color-lords-of-the-night-50: #f8f2ff;
--color-lords-of-the-night-100: #f2e5ff;
--color-lords-of-the-night-200: #e5caff;
--color-lords-of-the-night-300: #d4acf7;
--color-lords-of-the-night-400: #b58adb;
--color-lords-of-the-night-500: #996dbf;
--color-lords-of-the-night-600: #7d52a1;
--color-lords-of-the-night-700: #663a88;
--color-lords-of-the-night-800: #502d6b;
--color-lords-of-the-night-900: #3e2155;
--color-lords-of-the-night-950: #271238;
--color-fire: #913821;
--color-fire-50: #fff2ee;
--color-fire-100: #ffe4dd;
--color-fire-200: #ffcabc;
--color-fire-300: #ffa992;
--color-fire-400: #e4866e;
--color-fire-500: #c86a51;
--color-fire-600: #aa5039;
--color-fire-700: #913821;
--color-fire-800: #732a17;
--color-fire-900: #5c1d0d;
--color-fire-950: #3c0f05;
}
Similar palettes
- 1701003D093E452C4755247493421ADark Matter to Hot Brown
- 200500390719570D394C3254852212824B47Dwarf Fortress to Think Brick
- 1702222F003547252D64357C735C49Black Sabbath to Baby Bear
- 0E0022300F003E194789263B765772Glossy Black to Dr Who
- 1C001C3C11033D2D3E5D3F4D7A5700Black Sabbath to Coffee Adept
- 1100202E131B481757632B6A7D5962Glossy Black to Royal Fig
- 942E5354216F461800270002Raspberry Romantic to Dwarf Fortress
- 2516007236057E561B2800033E2000452A4ENoir Mystique to Murasaki