Blackn’t to Philodendron color palette

000D01Blackn’t 002420Sunken Ship 00381DDark Serpent 46472COlive Leaf 006751Philodendron

About this palette

Blackn’t to Philodendron is a 5-color dark, cool, gradient palette: #000D01 (Blackn’t), #002420 (Sunken Ship), #00381D (Dark Serpent), #46472C (Olive Leaf), #006751 (Philodendron). It mixes black, turquoise, green, brown tones and feels cool overall. The strongest text pairing is #000D01 on #006751 with a contrast ratio of 2.89:1, and 0 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Blackn’t	rgb(0, 13, 1)	hsl(125, 100%, 3%)
Sunken Ship	rgb(0, 36, 32)	hsl(173, 100%, 7%)
Dark Serpent	rgb(0, 56, 29)	hsl(151, 100%, 11%)
Olive Leaf	rgb(70, 71, 44)	hsl(62, 23%, 23%)
Philodendron	rgb(0, 103, 81)	hsl(167, 100%, 20%)

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

/* Blackn’t to Philodendron — https://swatchly.xyz/palette/000d01-002420-00381d-46472c-006751 */
:root {
  --blackn-t: #000d01;
  --sunken-ship: #002420;
  --dark-serpent: #00381d;
  --olive-leaf: #46472c;
  --philodendron: #006751;
}

Tailwind CSS v4

/* Blackn’t to Philodendron — https://swatchly.xyz/palette/000d01-002420-00381d-46472c-006751 */
@theme {
  --color-blackn-t: #000d01;
  --color-blackn-t-50: #ecfaec;
  --color-blackn-t-100: #e1f0e1;
  --color-blackn-t-200: #cbddcb;
  --color-blackn-t-300: #b3c8b3;
  --color-blackn-t-400: #92a992;
  --color-blackn-t-500: #718872;
  --color-blackn-t-600: #536954;
  --color-blackn-t-700: #3b4d3b;
  --color-blackn-t-800: #273527;
  --color-blackn-t-900: #172117;
  --color-blackn-t-950: #000d01;
  --color-sunken-ship: #002420;
  --color-sunken-ship-50: #e5faf7;
  --color-sunken-ship-100: #d9f1ed;
  --color-sunken-ship-200: #c2deda;
  --color-sunken-ship-300: #a9c9c3;
  --color-sunken-ship-400: #86aaa4;
  --color-sunken-ship-500: #6a8e89;
  --color-sunken-ship-600: #50736e;
  --color-sunken-ship-700: #3c5c57;
  --color-sunken-ship-800: #2c4743;
  --color-sunken-ship-900: #1f3733;
  --color-sunken-ship-950: #002420;
  --color-dark-serpent: #00381d;
  --color-dark-serpent-50: #e1feea;
  --color-dark-serpent-100: #d4f5de;
  --color-dark-serpent-200: #bce3c8;
  --color-dark-serpent-300: #a1cdb0;
  --color-dark-serpent-400: #7dae8e;
  --color-dark-serpent-500: #5f9171;
  --color-dark-serpent-600: #457557;
  --color-dark-serpent-700: #305c42;
  --color-dark-serpent-800: #214730;
  --color-dark-serpent-900: #00381d;
  --color-dark-serpent-950: #0a2113;
  --color-olive-leaf: #46472c;
  --color-olive-leaf-50: #f6f7e5;
  --color-olive-leaf-100: #ecedd9;
  --color-olive-leaf-200: #d8dac2;
  --color-olive-leaf-300: #c2c4a9;
  --color-olive-leaf-400: #a3a588;
  --color-olive-leaf-500: #898a6d;
  --color-olive-leaf-600: #6f7054;
  --color-olive-leaf-700: #585a40;
  --color-olive-leaf-800: #46472c;
  --color-olive-leaf-900: #363623;
  --color-olive-leaf-950: #212214;
  --color-philodendron: #006751;
  --color-philodendron-50: #dafff2;
  --color-philodendron-100: #c7f8e7;
  --color-philodendron-200: #ace7d2;
  --color-philodendron-300: #8ed2bc;
  --color-philodendron-400: #67b49c;
  --color-philodendron-500: #479981;
  --color-philodendron-600: #2a7e67;
  --color-philodendron-700: #006751;
  --color-philodendron-800: #00513f;
  --color-philodendron-900: #003e30;
  --color-philodendron-950: #00271d;
}