Start generating

Plein Air to Dusty Chimney color palette

B7C1D4Plein Air56482EOlive Leaf5D6777Alley CatF0E8D8Platinum Blonde262214Underworld818DA7Dusty Chimney
Open in generator Export PNG, PDF, ASE…

About this palette

Plein Air to Dusty Chimney is a 6-color muted palette: #B7C1D4 (Plein Air), #56482E (Olive Leaf), #5D6777 (Alley Cat), #F0E8D8 (Platinum Blonde), #262214 (Underworld), #818DA7 (Dusty Chimney). It mixes gray, brown, white, blue tones and feels balanced overall. The strongest text pairing is #F0E8D8 on #262214 with a contrast ratio of 13.05:1, and 6 of its 15 color pairs pass WCAG AA for normal text.

Color codes

ColorHEXRGBHSL
Plein Airrgb(183, 193, 212)hsl(219, 25%, 77%)
Olive Leafrgb(86, 72, 46)hsl(39, 30%, 26%)
Alley Catrgb(93, 103, 119)hsl(217, 12%, 42%)
Platinum Blondergb(240, 232, 216)hsl(40, 44%, 89%)
Underworldrgb(38, 34, 20)hsl(47, 31%, 11%)
Dusty Chimneyrgb(129, 141, 167)hsl(221, 18%, 58%)

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.

  • Aa13.05:1 Super#F0E8D8 on #262214
  • Aa13.05:1 Super#262214 on #F0E8D8
  • Aa8.77:1 Very good#B7C1D4 on #262214
  • Aa8.77:1 Very good#262214 on #B7C1D4
  • Aa7.30:1 Very good#56482E on #F0E8D8
  • Aa7.30:1 Very good#F0E8D8 on #56482E
  • Aa4.91:1 Good#B7C1D4 on #56482E
  • Aa4.91:1 Good#56482E on #B7C1D4

Color blindness preview

  • Protanopia
  • Deuteranopia
  • Tritanopia
  • Achromatopsia
  • Dog vision

CSS variables

/* Plein Air to Dusty Chimney — https://swatchly.xyz/palette/b7c1d4-56482e-5d6777-f0e8d8-262214-818da7 */
:root {
  --plein-air: #b7c1d4;
  --olive-leaf: #56482e;
  --alley-cat: #5d6777;
  --platinum-blonde: #f0e8d8;
  --underworld: #262214;
  --dusty-chimney: #818da7;
}

Tailwind CSS v4

/* Plein Air to Dusty Chimney — https://swatchly.xyz/palette/b7c1d4-56482e-5d6777-f0e8d8-262214-818da7 */
@theme {
  --color-plein-air: #b7c1d4;
  --color-plein-air-50: #f0f5ff;
  --color-plein-air-100: #e5ebf7;
  --color-plein-air-200: #d0d8e6;
  --color-plein-air-300: #b7c1d4;
  --color-plein-air-400: #98a2b3;
  --color-plein-air-500: #7d8698;
  --color-plein-air-600: #636c7d;
  --color-plein-air-700: #4d5565;
  --color-plein-air-800: #3c4250;
  --color-plein-air-900: #2d333e;
  --color-plein-air-950: #1b1f27;
  --color-olive-leaf: #56482e;
  --color-olive-leaf-50: #fdf4e3;
  --color-olive-leaf-100: #f4ead7;
  --color-olive-leaf-200: #e2d6c0;
  --color-olive-leaf-300: #cfc1a8;
  --color-olive-leaf-400: #b2a387;
  --color-olive-leaf-500: #98886d;
  --color-olive-leaf-600: #7e6f54;
  --color-olive-leaf-700: #685a41;
  --color-olive-leaf-800: #56482e;
  --color-olive-leaf-900: #423724;
  --color-olive-leaf-950: #2a2314;
  --color-alley-cat: #5d6777;
  --color-alley-cat-50: #f0f6ff;
  --color-alley-cat-100: #e3ebf6;
  --color-alley-cat-200: #cdd6e4;
  --color-alley-cat-300: #b5bfce;
  --color-alley-cat-400: #949eaf;
  --color-alley-cat-500: #788293;
  --color-alley-cat-600: #5d6777;
  --color-alley-cat-700: #49515f;
  --color-alley-cat-800: #383f4c;
  --color-alley-cat-900: #2a313b;
  --color-alley-cat-950: #191e25;
  --color-platinum-blonde: #f0e8d8;
  --color-platinum-blonde-50: #f7f3ea;
  --color-platinum-blonde-100: #f0e8d8;
  --color-platinum-blonde-200: #dbd5c9;
  --color-platinum-blonde-300: #c5bfb1;
  --color-platinum-blonde-400: #a7a091;
  --color-platinum-blonde-500: #8c8576;
  --color-platinum-blonde-600: #726b5d;
  --color-platinum-blonde-700: #5b5548;
  --color-platinum-blonde-800: #474237;
  --color-platinum-blonde-900: #373229;
  --color-platinum-blonde-950: #221f18;
  --color-underworld: #262214;
  --color-underworld-50: #f8f5eb;
  --color-underworld-100: #eeebe0;
  --color-underworld-200: #dbd8ca;
  --color-underworld-300: #c5c1b2;
  --color-underworld-400: #a6a291;
  --color-underworld-500: #8c8776;
  --color-underworld-600: #716d5d;
  --color-underworld-700: #5b5748;
  --color-underworld-800: #484438;
  --color-underworld-900: #38352a;
  --color-underworld-950: #262214;
  --color-dusty-chimney: #818da7;
  --color-dusty-chimney-50: #f2f6ff;
  --color-dusty-chimney-100: #e6eeff;
  --color-dusty-chimney-200: #d2dbf0;
  --color-dusty-chimney-300: #bbc6dd;
  --color-dusty-chimney-400: #9ca7c1;
  --color-dusty-chimney-500: #818da7;
  --color-dusty-chimney-600: #66718a;
  --color-dusty-chimney-700: #4f5970;
  --color-dusty-chimney-800: #3c4559;
  --color-dusty-chimney-900: #2d3545;
  --color-dusty-chimney-950: #1b202c;
}

Similar palettes