Sky High to Water Leaf Color Palette

About this palette

Sky High to Water Leaf is a 4-color pastel, light, cool palette: #B8C1F1 (Sky High), #F2D9AE (Vinaigrette), #EEFFC7 (Kiwi Kiss), #A3EEDF (Water Leaf). It mixes purple, yellow, green, turquoise tones and feels cool overall. The strongest text pairing is #B8C1F1 on #EEFFC7 with a contrast ratio of 1.66:1, and 0 of its 6 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Sky High	rgb(184, 193, 241)	hsl(231, 67%, 83%)
Vinaigrette	rgb(242, 217, 174)	hsl(38, 72%, 82%)
Kiwi Kiss	rgb(238, 255, 199)	hsl(78, 100%, 89%)
Water Leaf	rgb(163, 238, 223)	hsl(168, 69%, 79%)

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

/* Sky High to Water Leaf — https://swatchly.xyz/palette/b8c1f1-f2d9ae-eeffc7-a3eedf */
:root {
  --sky-high: #b8c1f1;
  --vinaigrette: #f2d9ae;
  --kiwi-kiss: #eeffc7;
  --water-leaf: #a3eedf;
}

Tailwind CSS v4

/* Sky High to Water Leaf — https://swatchly.xyz/palette/b8c1f1-f2d9ae-eeffc7-a3eedf */
@theme {
  --color-sky-high: #b8c1f1;
  --color-sky-high-50: #f4f6ff;
  --color-sky-high-100: #e9ecff;
  --color-sky-high-200: #d1d8fc;
  --color-sky-high-300: #b8c1f1;
  --color-sky-high-400: #99a1cd;
  --color-sky-high-500: #7d85b2;
  --color-sky-high-600: #636a94;
  --color-sky-high-700: #4d537a;
  --color-sky-high-800: #3b4061;
  --color-sky-high-900: #2c304d;
  --color-sky-high-950: #1a1d32;
  --color-vinaigrette: #f2d9ae;
  --color-vinaigrette-50: #fff8eb;
  --color-vinaigrette-100: #fceed4;
  --color-vinaigrette-200: #f2d9ae;
  --color-vinaigrette-300: #d7c29f;
  --color-vinaigrette-400: #b8a17a;
  --color-vinaigrette-500: #9c855d;
  --color-vinaigrette-600: #806a43;
  --color-vinaigrette-700: #67532f;
  --color-vinaigrette-800: #513f20;
  --color-vinaigrette-900: #3f3015;
  --color-vinaigrette-950: #281d0a;
  --color-kiwi-kiss: #eeffc7;
  --color-kiwi-kiss-50: #eeffc7;
  --color-kiwi-kiss-100: #e7f2d0;
  --color-kiwi-kiss-200: #d2dfb7;
  --color-kiwi-kiss-300: #bbc89b;
  --color-kiwi-kiss-400: #9ba977;
  --color-kiwi-kiss-500: #7f8e5a;
  --color-kiwi-kiss-600: #657341;
  --color-kiwi-kiss-700: #4f5b2e;
  --color-kiwi-kiss-800: #3d471f;
  --color-kiwi-kiss-900: #2e3715;
  --color-kiwi-kiss-950: #1c220a;
  --color-water-leaf: #a3eedf;
  --color-water-leaf-50: #e6fff9;
  --color-water-leaf-100: #d0faf1;
  --color-water-leaf-200: #a3eedf;
  --color-water-leaf-300: #97d3c7;
  --color-water-leaf-400: #6fb4a7;
  --color-water-leaf-500: #4e988b;
  --color-water-leaf-600: #327c6f;
  --color-water-leaf-700: #1b6358;
  --color-water-leaf-800: #0a4d44;
  --color-water-leaf-900: #013c34;
  --color-water-leaf-950: #002620;
}