Start generating

Veiling Waterfalls to Smell the Mint color palette

D3E3FFVeiling WaterfallsD1FEFFMount OlympusC3C2FCInnocent Snowdrop87CDE7Below ZeroB5FAD6Smell the Mint
Open in generator Export PNG, PDF, ASE…

About this palette

Veiling Waterfalls to Smell the Mint is a 5-color pastel, light, cool palette: #D3E3FF (Veiling Waterfalls), #D1FEFF (Mount Olympus), #C3C2FC (Innocent Snowdrop), #87CDE7 (Below Zero), #B5FAD6 (Smell the Mint). It mixes blue, white, purple, green tones and feels cool overall. The strongest text pairing is #D1FEFF on #87CDE7 with a contrast ratio of 1.62:1, and 0 of its 10 color pairs pass WCAG AA for normal text.

Color codes

ColorHEXRGBHSL
Veiling Waterfallsrgb(211, 227, 255)hsl(218, 100%, 91%)
Mount Olympusrgb(209, 254, 255)hsl(181, 100%, 91%)
Innocent Snowdroprgb(195, 194, 252)hsl(241, 91%, 87%)
Below Zerorgb(135, 205, 231)hsl(196, 67%, 72%)
Smell the Mintrgb(181, 250, 214)hsl(149, 87%, 85%)

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

    • Protanopia
    • Deuteranopia
    • Tritanopia
    • Achromatopsia
    • Dog vision

    CSS variables

    /* Veiling Waterfalls to Smell the Mint — https://swatchly.xyz/palette/d3e3ff-d1feff-c3c2fc-87cde7-b5fad6 */
:root {
  --veiling-waterfalls: #d3e3ff;
  --mount-olympus: #d1feff;
  --innocent-snowdrop: #c3c2fc;
  --below-zero: #87cde7;
  --smell-the-mint: #b5fad6;
}

    Tailwind CSS v4

    /* Veiling Waterfalls to Smell the Mint — https://swatchly.xyz/palette/d3e3ff-d1feff-c3c2fc-87cde7-b5fad6 */
@theme {
  --color-veiling-waterfalls: #d3e3ff;
  --color-veiling-waterfalls-50: #e4eeff;
  --color-veiling-waterfalls-100: #d3e3ff;
  --color-veiling-waterfalls-200: #c4d1e6;
  --color-veiling-waterfalls-300: #aebcd4;
  --color-veiling-waterfalls-400: #909eb7;
  --color-veiling-waterfalls-500: #76849d;
  --color-veiling-waterfalls-600: #5d6b83;
  --color-veiling-waterfalls-700: #49566b;
  --color-veiling-waterfalls-800: #384356;
  --color-veiling-waterfalls-900: #2a3343;
  --color-veiling-waterfalls-950: #191f2b;
  --color-mount-olympus: #d1feff;
  --color-mount-olympus-50: #d1feff;
  --color-mount-olympus-100: #d5f0f1;
  --color-mount-olympus-200: #bededf;
  --color-mount-olympus-300: #a4c9c9;
  --color-mount-olympus-400: #81aaab;
  --color-mount-olympus-500: #658f90;
  --color-mount-olympus-600: #4c7475;
  --color-mount-olympus-700: #385d5e;
  --color-mount-olympus-800: #28494a;
  --color-mount-olympus-900: #1c3839;
  --color-mount-olympus-950: #0f2324;
  --color-innocent-snowdrop: #c3c2fc;
  --color-innocent-snowdrop-50: #f8f9ff;
  --color-innocent-snowdrop-100: #efefff;
  --color-innocent-snowdrop-200: #dadaff;
  --color-innocent-snowdrop-300: #c3c2fc;
  --color-innocent-snowdrop-400: #a3a2d6;
  --color-innocent-snowdrop-500: #8684ba;
  --color-innocent-snowdrop-600: #6b699c;
  --color-innocent-snowdrop-700: #535180;
  --color-innocent-snowdrop-800: #403e66;
  --color-innocent-snowdrop-900: #302e50;
  --color-innocent-snowdrop-950: #1d1c34;
  --color-below-zero: #87cde7;
  --color-below-zero-50: #e8f9ff;
  --color-below-zero-100: #d0f2ff;
  --color-below-zero-200: #aee1f4;
  --color-below-zero-300: #87cde7;
  --color-below-zero-400: #6badc5;
  --color-below-zero-500: #4b91a9;
  --color-below-zero-600: #30768d;
  --color-below-zero-700: #1b5e73;
  --color-below-zero-800: #0b4a5c;
  --color-below-zero-900: #023949;
  --color-below-zero-950: #00242f;
  --color-smell-the-mint: #b5fad6;
  --color-smell-the-mint-50: #d7fde8;
  --color-smell-the-mint-100: #b5fad6;
  --color-smell-the-mint-200: #b0e2c7;
  --color-smell-the-mint-300: #94ceb0;
  --color-smell-the-mint-400: #70b090;
  --color-smell-the-mint-500: #539575;
  --color-smell-the-mint-600: #397a5c;
  --color-smell-the-mint-700: #256347;
  --color-smell-the-mint-800: #164e36;
  --color-smell-the-mint-900: #0c3c28;
  --color-smell-the-mint-950: #042618;
}

    Similar palettes