Start generating

Vaporised to Icy Plains color palette

C6F3FFVaporisedF9F4D4Lunar LuxuryC2D3ABMorris Leaf93D0C2WintermintD8D7FAIcy Plains
Open in generator Export PNG, PDF, ASE…

About this palette

Vaporised to Icy Plains is a 5-color pastel, light, cool palette: #C6F3FF (Vaporised), #F9F4D4 (Lunar Luxury), #C2D3AB (Morris Leaf), #93D0C2 (Wintermint), #D8D7FA (Icy Plains). It mixes blue, white, green, turquoise, purple tones and feels cool overall. The strongest text pairing is #F9F4D4 on #93D0C2 with a contrast ratio of 1.57:1, and 0 of its 10 color pairs pass WCAG AA for normal text.

Color codes

ColorHEXRGBHSL
Vaporisedrgb(198, 243, 255)hsl(193, 100%, 89%)
Lunar Luxuryrgb(249, 244, 212)hsl(52, 76%, 90%)
Morris Leafrgb(194, 211, 171)hsl(85, 31%, 75%)
Wintermintrgb(147, 208, 194)hsl(166, 39%, 70%)
Icy Plainsrgb(216, 215, 250)hsl(242, 78%, 91%)

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

    /* Vaporised to Icy Plains — https://swatchly.xyz/palette/c6f3ff-f9f4d4-c2d3ab-93d0c2-d8d7fa */
:root {
  --vaporised: #c6f3ff;
  --lunar-luxury: #f9f4d4;
  --morris-leaf: #c2d3ab;
  --wintermint: #93d0c2;
  --icy-plains: #d8d7fa;
}

    Tailwind CSS v4

    /* Vaporised to Icy Plains — https://swatchly.xyz/palette/c6f3ff-f9f4d4-c2d3ab-93d0c2-d8d7fa */
@theme {
  --color-vaporised: #c6f3ff;
  --color-vaporised-50: #e2f9ff;
  --color-vaporised-100: #c6f3ff;
  --color-vaporised-200: #bddde6;
  --color-vaporised-300: #a2c8d1;
  --color-vaporised-400: #80a9b4;
  --color-vaporised-500: #648e99;
  --color-vaporised-600: #4a737d;
  --color-vaporised-700: #365c65;
  --color-vaporised-800: #274850;
  --color-vaporised-900: #1b383f;
  --color-vaporised-950: #0e2328;
  --color-lunar-luxury: #f9f4d4;
  --color-lunar-luxury-50: #f9f4d4;
  --color-lunar-luxury-100: #edead6;
  --color-lunar-luxury-200: #dad7bf;
  --color-lunar-luxury-300: #c5c1a6;
  --color-lunar-luxury-400: #a6a285;
  --color-lunar-luxury-500: #8b876a;
  --color-lunar-luxury-600: #716d51;
  --color-lunar-luxury-700: #5a563d;
  --color-lunar-luxury-800: #47432d;
  --color-lunar-luxury-900: #363321;
  --color-lunar-luxury-950: #222012;
  --color-morris-leaf: #c2d3ab;
  --color-morris-leaf-50: #f6ffea;
  --color-morris-leaf-100: #edf7e0;
  --color-morris-leaf-200: #dae6ca;
  --color-morris-leaf-300: #c2d3ab;
  --color-morris-leaf-400: #a1b18c;
  --color-morris-leaf-500: #84946e;
  --color-morris-leaf-600: #687753;
  --color-morris-leaf-700: #515e3d;
  --color-morris-leaf-800: #3d492c;
  --color-morris-leaf-900: #2d371f;
  --color-morris-leaf-950: #1b2211;
  --color-wintermint: #93d0c2;
  --color-wintermint-50: #ddfef6;
  --color-wintermint-100: #d0f5ec;
  --color-wintermint-200: #b7e3d8;
  --color-wintermint-300: #93d0c2;
  --color-wintermint-400: #76afa2;
  --color-wintermint-500: #589487;
  --color-wintermint-600: #3e786c;
  --color-wintermint-700: #2a6156;
  --color-wintermint-800: #1b4c43;
  --color-wintermint-900: #103b33;
  --color-wintermint-950: #06251f;
  --color-icy-plains: #d8d7fa;
  --color-icy-plains-50: #f7f7ff;
  --color-icy-plains-100: #ececff;
  --color-icy-plains-200: #d8d7fa;
  --color-icy-plains-300: #c1c0dd;
  --color-icy-plains-400: #a1a0c0;
  --color-icy-plains-500: #8584a4;
  --color-icy-plains-600: #6a6987;
  --color-icy-plains-700: #54526e;
  --color-icy-plains-800: #413f57;
  --color-icy-plains-900: #313044;
  --color-icy-plains-950: #1e1d2c;
}

    Similar palettes