Black Velvet to Crow Color Palette

About this palette

Black Velvet to Crow is a 5-color dark, warm palette: #2A2231 (Black Velvet), #6F4B55 (Nocturne Red), #003145 (Nordic Noir), #733467 (Grape), #1D0512 (Crow). It mixes gray, red, blue, purple, black tones and feels warm overall. The strongest text pairing is #6F4B55 on #1D0512 with a contrast ratio of 2.60:1, and 0 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Black Velvet	rgb(42, 34, 49)	hsl(272, 18%, 16%)
Nocturne Red	rgb(111, 75, 85)	hsl(343, 19%, 36%)
Nordic Noir	rgb(0, 49, 69)	hsl(197, 100%, 14%)
Grape	rgb(115, 52, 103)	hsl(311, 38%, 33%)
Crow	rgb(29, 5, 18)	hsl(328, 71%, 7%)

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 Velvet to Crow — https://swatchly.xyz/palette/2a2231-6f4b55-003145-733467-1d0512 */
:root {
  --black-velvet: #2a2231;
  --nocturne-red: #6f4b55;
  --nordic-noir: #003145;
  --grape: #733467;
  --crow: #1d0512;
}

Tailwind CSS v4

/* Black Velvet to Crow — https://swatchly.xyz/palette/2a2231-6f4b55-003145-733467-1d0512 */
@theme {
  --color-black-velvet: #2a2231;
  --color-black-velvet-50: #f8f2fe;
  --color-black-velvet-100: #efe8f5;
  --color-black-velvet-200: #dcd4e3;
  --color-black-velvet-300: #c5bdce;
  --color-black-velvet-400: #a79daf;
  --color-black-velvet-500: #8d8395;
  --color-black-velvet-600: #736a7c;
  --color-black-velvet-700: #5e5565;
  --color-black-velvet-800: #4b4452;
  --color-black-velvet-900: #3c3642;
  --color-black-velvet-950: #2a2231;
  --color-nocturne-red: #6f4b55;
  --color-nocturne-red-50: #fff1f4;
  --color-nocturne-red-100: #fee3ea;
  --color-nocturne-red-200: #eeced6;
  --color-nocturne-red-300: #dbb6c0;
  --color-nocturne-red-400: #bd96a0;
  --color-nocturne-red-500: #a27b85;
  --color-nocturne-red-600: #86616b;
  --color-nocturne-red-700: #6f4b55;
  --color-nocturne-red-800: #573a42;
  --color-nocturne-red-900: #442c33;
  --color-nocturne-red-950: #2c1a1f;
  --color-nordic-noir: #003145;
  --color-nordic-noir-50: #eaf8ff;
  --color-nordic-noir-100: #d5f0ff;
  --color-nordic-noir-200: #bbddf0;
  --color-nordic-noir-300: #a0c7dd;
  --color-nordic-noir-400: #7ca7be;
  --color-nordic-noir-500: #5e8aa2;
  --color-nordic-noir-600: #446e84;
  --color-nordic-noir-700: #2f566a;
  --color-nordic-noir-800: #204152;
  --color-nordic-noir-900: #003145;
  --color-nordic-noir-950: #0a1d26;
  --color-grape: #733467;
  --color-grape-50: #fff0fb;
  --color-grape-100: #ffe1f7;
  --color-grape-200: #fac2ec;
  --color-grape-300: #e6a7d7;
  --color-grape-400: #c884b9;
  --color-grape-500: #ab679c;
  --color-grape-600: #8c4d7f;
  --color-grape-700: #733467;
  --color-grape-800: #5a2950;
  --color-grape-900: #471d3f;
  --color-grape-950: #2d1028;
  --color-crow: #1d0512;
  --color-crow-50: #fff1f7;
  --color-crow-100: #fce4ee;
  --color-crow-200: #ebcedb;
  --color-crow-300: #d6b7c5;
  --color-crow-400: #b996a6;
  --color-crow-500: #997787;
  --color-crow-600: #7a5a69;
  --color-crow-700: #5d424f;
  --color-crow-800: #442e39;
  --color-crow-900: #2f1e26;
  --color-crow-950: #1d0512;
}