Black Knight to Pleasure color palette

010818Black Knight 09212FThe Count’s Black 202A6DMythical Night 4B388EMajestic Eggplant 7E3F61Pleasure

Open in generator Export PNG, PDF, ASE…

About this palette

Black Knight to Pleasure is a 5-color dark, cool, gradient palette: #010818 (Black Knight), #09212F (The Count’s Black), #202A6D (Mythical Night), #4B388E (Majestic Eggplant), #7E3F61 (Pleasure). It mixes black, blue, purple, red tones and feels cool overall. The strongest text pairing is #010818 on #7E3F61 with a contrast ratio of 2.64:1, and 0 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Black Knight	rgb(1, 8, 24)	hsl(222, 92%, 5%)
The Count’s Black	rgb(9, 33, 47)	hsl(202, 68%, 11%)
Mythical Night	rgb(32, 42, 109)	hsl(232, 55%, 28%)
Majestic Eggplant	rgb(75, 56, 142)	hsl(253, 43%, 39%)
Pleasure	rgb(126, 63, 97)	hsl(328, 33%, 37%)

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

CSS variables

/* Black Knight to Pleasure — https://swatchly.xyz/palette/010818-09212f-202a6d-4b388e-7e3f61 */
:root {
  --black-knight: #010818;
  --the-count-s-black: #09212f;
  --mythical-night: #202a6d;
  --majestic-eggplant: #4b388e;
  --pleasure: #7e3f61;
}

Tailwind CSS v4

/* Black Knight to Pleasure — https://swatchly.xyz/palette/010818-09212f-202a6d-4b388e-7e3f61 */
@theme {
  --color-black-knight: #010818;
  --color-black-knight-50: #eff6ff;
  --color-black-knight-100: #e1ecfc;
  --color-black-knight-200: #cbd9eb;
  --color-black-knight-300: #b3c2d7;
  --color-black-knight-400: #93a3ba;
  --color-black-knight-500: #728299;
  --color-black-knight-600: #546378;
  --color-black-knight-700: #3b485a;
  --color-black-knight-800: #27313f;
  --color-black-knight-900: #171e28;
  --color-black-knight-950: #010818;
  --color-the-count-s-black: #09212f;
  --color-the-count-s-black-50: #ebf7ff;
  --color-the-count-s-black-100: #ddeefa;
  --color-the-count-s-black-200: #c6dbe9;
  --color-the-count-s-black-300: #adc5d5;
  --color-the-count-s-black-400: #8ca6b7;
  --color-the-count-s-black-500: #708a9c;
  --color-the-count-s-black-600: #566f80;
  --color-the-count-s-black-700: #415867;
  --color-the-count-s-black-800: #314552;
  --color-the-count-s-black-900: #24343f;
  --color-the-count-s-black-950: #09212f;
  --color-mythical-night: #202a6d;
  --color-mythical-night-50: #f2f5ff;
  --color-mythical-night-100: #e4ebff;
  --color-mythical-night-200: #c9d6ff;
  --color-mythical-night-300: #abbeff;
  --color-mythical-night-400: #899de7;
  --color-mythical-night-500: #6e81cc;
  --color-mythical-night-600: #5566ae;
  --color-mythical-night-700: #415091;
  --color-mythical-night-800: #313d76;
  --color-mythical-night-900: #202a6d;
  --color-mythical-night-950: #151c3f;
  --color-majestic-eggplant: #4b388e;
  --color-majestic-eggplant-50: #f4f4ff;
  --color-majestic-eggplant-100: #eae8ff;
  --color-majestic-eggplant-200: #d6d1ff;
  --color-majestic-eggplant-300: #c0b8ff;
  --color-majestic-eggplant-400: #a396f0;
  --color-majestic-eggplant-500: #897bd7;
  --color-majestic-eggplant-600: #7161bb;
  --color-majestic-eggplant-700: #5c4c9f;
  --color-majestic-eggplant-800: #4b388e;
  --color-majestic-eggplant-900: #392c6c;
  --color-majestic-eggplant-950: #241a49;
  --color-pleasure: #7e3f61;
  --color-pleasure-50: #fff1f7;
  --color-pleasure-100: #ffe2ef;
  --color-pleasure-200: #fdc5e0;
  --color-pleasure-300: #ebaccb;
  --color-pleasure-400: #ce8bad;
  --color-pleasure-500: #b36f92;
  --color-pleasure-600: #965678;
  --color-pleasure-700: #7e3f61;
  --color-pleasure-800: #63304c;
  --color-pleasure-900: #4f233b;
  --color-pleasure-950: #331425;
}