Blue Silk to Ink Black color palette

D0D9ECBlue Silk B6B18FGreen Tea 6D738DFlying Carpet 425643Plantation 282027Ink Black

About this palette

Blue Silk to Ink Black is a 5-color muted palette: #D0D9EC (Blue Silk), #B6B18F (Green Tea), #6D738D (Flying Carpet), #425643 (Plantation), #282027 (Ink Black). It mixes gray, yellow, blue, green tones and feels cool overall. The strongest text pairing is #D0D9EC on #282027 with a contrast ratio of 11.17:1, and 3 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Blue Silk	rgb(208, 217, 236)	hsl(221, 42%, 87%)
Green Tea	rgb(182, 177, 143)	hsl(52, 21%, 64%)
Flying Carpet	rgb(109, 115, 141)	hsl(229, 13%, 49%)
Plantation	rgb(66, 86, 67)	hsl(123, 13%, 30%)
Ink Black	rgb(40, 32, 39)	hsl(308, 11%, 14%)

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.

Aa11.17:1 Very good#D0D9EC on #282027
Aa11.17:1 Very good#282027 on #D0D9EC
Aa7.30:1 Very good#B6B18F on #282027
Aa7.30:1 Very good#282027 on #B6B18F
Aa5.60:1 Good#D0D9EC on #425643
Aa5.60:1 Good#425643 on #D0D9EC
Aa3.66:1 Poor#B6B18F on #425643
Aa3.66:1 Poor#425643 on #B6B18F

Color blindness preview

CSS variables

/* Blue Silk to Ink Black — https://swatchly.xyz/palette/d0d9ec-b6b18f-6d738d-425643-282027 */
:root {
  --blue-silk: #d0d9ec;
  --green-tea: #b6b18f;
  --flying-carpet: #6d738d;
  --plantation: #425643;
  --ink-black: #282027;
}

Tailwind CSS v4

/* Blue Silk to Ink Black — https://swatchly.xyz/palette/d0d9ec-b6b18f-6d738d-425643-282027 */
@theme {
  --color-blue-silk: #d0d9ec;
  --color-blue-silk-50: #f2f6ff;
  --color-blue-silk-100: #e7ecf8;
  --color-blue-silk-200: #d0d9ec;
  --color-blue-silk-300: #bbc2d2;
  --color-blue-silk-400: #9aa2b4;
  --color-blue-silk-500: #7f8798;
  --color-blue-silk-600: #656c7d;
  --color-blue-silk-700: #4f5564;
  --color-blue-silk-800: #3c424f;
  --color-blue-silk-900: #2e333e;
  --color-blue-silk-950: #1c1f27;
  --color-green-tea: #b6b18f;
  --color-green-tea-50: #fdfbe9;
  --color-green-tea-100: #f6f4e0;
  --color-green-tea-200: #e6e2cb;
  --color-green-tea-300: #d2ceb3;
  --color-green-tea-400: #b6b18f;
  --color-green-tea-500: #989372;
  --color-green-tea-600: #7a7656;
  --color-green-tea-700: #615d3f;
  --color-green-tea-800: #4b472d;
  --color-green-tea-900: #393520;
  --color-green-tea-950: #222010;
  --color-flying-carpet: #6d738d;
  --color-flying-carpet-50: #f2f5ff;
  --color-flying-carpet-100: #e8ecfe;
  --color-flying-carpet-200: #d5daef;
  --color-flying-carpet-300: #bfc5dc;
  --color-flying-carpet-400: #a0a6c1;
  --color-flying-carpet-500: #868ca7;
  --color-flying-carpet-600: #6d738d;
  --color-flying-carpet-700: #555b72;
  --color-flying-carpet-800: #42465b;
  --color-flying-carpet-900: #323647;
  --color-flying-carpet-950: #1e212d;
  --color-plantation: #425643;
  --color-plantation-50: #ecf9ed;
  --color-plantation-100: #e1f0e2;
  --color-plantation-200: #cbdccb;
  --color-plantation-300: #b1c5b2;
  --color-plantation-400: #90a591;
  --color-plantation-500: #748974;
  --color-plantation-600: #596d5a;
  --color-plantation-700: #425643;
  --color-plantation-800: #334334;
  --color-plantation-900: #263427;
  --color-plantation-950: #162017;
  --color-ink-black: #282027;
  --color-ink-black-50: #f9f3f8;
  --color-ink-black-100: #f0e9ef;
  --color-ink-black-200: #ddd4db;
  --color-ink-black-300: #c7bec5;
  --color-ink-black-400: #a89ea6;
  --color-ink-black-500: #8d838c;
  --color-ink-black-600: #736a72;
  --color-ink-black-700: #5d545c;
  --color-ink-black-800: #4a4249;
  --color-ink-black-900: #3a3439;
  --color-ink-black-950: #282027;
}