Royal Lavender to Veiling Waterfalls color palette

794FA7Royal Lavender 4F3771Meteorite 6688BFOrbital 95BBFFPastel Blue 64A7CECousteau D1ECFFVeiling Waterfalls

Open in generator Export PNG, PDF, ASE…

About this palette

Royal Lavender to Veiling Waterfalls is a 6-color cool palette: #794FA7 (Royal Lavender), #4F3771 (Meteorite), #6688BF (Orbital), #95BBFF (Pastel Blue), #64A7CE (Cousteau), #D1ECFF (Veiling Waterfalls). It mixes purple, blue tones and feels cool overall. The strongest text pairing is #4F3771 on #D1ECFF with a contrast ratio of 8.10:1, and 3 of its 15 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Royal Lavender	rgb(121, 79, 167)	hsl(269, 36%, 48%)
Meteorite	rgb(79, 55, 113)	hsl(265, 35%, 33%)
Orbital	rgb(102, 136, 191)	hsl(217, 41%, 57%)
Pastel Blue	rgb(149, 187, 255)	hsl(218, 100%, 79%)
Cousteau	rgb(100, 167, 206)	hsl(202, 52%, 60%)
Veiling Waterfalls	rgb(209, 236, 255)	hsl(205, 100%, 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.

Aa8.10:1 Very good#4F3771 on #D1ECFF
Aa8.10:1 Very good#D1ECFF on #4F3771
Aa5.11:1 Good#4F3771 on #95BBFF
Aa5.11:1 Good#95BBFF on #4F3771
Aa4.92:1 Good#794FA7 on #D1ECFF
Aa4.92:1 Good#D1ECFF on #794FA7
Aa3.76:1 Poor#4F3771 on #64A7CE
Aa3.76:1 Poor#64A7CE on #4F3771

Color blindness preview

CSS variables

/* Royal Lavender to Veiling Waterfalls — https://swatchly.xyz/palette/794fa7-4f3771-6688bf-95bbff-64a7ce-d1ecff */
:root {
  --royal-lavender: #794fa7;
  --meteorite: #4f3771;
  --orbital: #6688bf;
  --pastel-blue: #95bbff;
  --cousteau: #64a7ce;
  --veiling-waterfalls: #d1ecff;
}

Tailwind CSS v4

/* Royal Lavender to Veiling Waterfalls — https://swatchly.xyz/palette/794fa7-4f3771-6688bf-95bbff-64a7ce-d1ecff */
@theme {
  --color-royal-lavender: #794fa7;
  --color-royal-lavender-50: #f7f2ff;
  --color-royal-lavender-100: #efe5ff;
  --color-royal-lavender-200: #e0caff;
  --color-royal-lavender-300: #cfabfd;
  --color-royal-lavender-400: #b088e2;
  --color-royal-lavender-500: #956bc5;
  --color-royal-lavender-600: #794fa7;
  --color-royal-lavender-700: #613c89;
  --color-royal-lavender-800: #4d2c70;
  --color-royal-lavender-900: #3c2059;
  --color-royal-lavender-950: #26123b;
  --color-meteorite: #4f3771;
  --color-meteorite-50: #f7f3ff;
  --color-meteorite-100: #efe6ff;
  --color-meteorite-200: #dfcdff;
  --color-meteorite-300: #cab6ef;
  --color-meteorite-400: #ad95d4;
  --color-meteorite-500: #927aba;
  --color-meteorite-600: #78609d;
  --color-meteorite-700: #614b83;
  --color-meteorite-800: #4f3771;
  --color-meteorite-900: #3c2b55;
  --color-meteorite-950: #261a38;
  --color-orbital: #6688bf;
  --color-orbital-50: #f0f6ff;
  --color-orbital-100: #e1ecff;
  --color-orbital-200: #c2daff;
  --color-orbital-300: #a4c3f5;
  --color-orbital-400: #82a4da;
  --color-orbital-500: #6688bf;
  --color-orbital-600: #4d6da1;
  --color-orbital-700: #395685;
  --color-orbital-800: #29436c;
  --color-orbital-900: #1d3356;
  --color-orbital-950: #101f38;
  --color-pastel-blue: #95bbff;
  --color-pastel-blue-50: #ebf2ff;
  --color-pastel-blue-100: #dae8ff;
  --color-pastel-blue-200: #bad3ff;
  --color-pastel-blue-300: #95bbff;
  --color-pastel-blue-400: #799cdc;
  --color-pastel-blue-500: #5e82c2;
  --color-pastel-blue-600: #4768a4;
  --color-pastel-blue-700: #345289;
  --color-pastel-blue-800: #264070;
  --color-pastel-blue-900: #1b315a;
  --color-pastel-blue-950: #0e1e3c;
  --color-cousteau: #64a7ce;
  --color-cousteau-50: #e9f6ff;
  --color-cousteau-100: #d3eeff;
  --color-cousteau-200: #abddfc;
  --color-cousteau-300: #8dc6e9;
  --color-cousteau-400: #64a7ce;
  --color-cousteau-500: #498cb2;
  --color-cousteau-600: #2f7195;
  --color-cousteau-700: #1b5a7b;
  --color-cousteau-800: #0c4763;
  --color-cousteau-900: #03374f;
  --color-cousteau-950: #002234;
  --color-veiling-waterfalls: #d1ecff;
  --color-veiling-waterfalls-50: #e6f5ff;
  --color-veiling-waterfalls-100: #d1ecff;
  --color-veiling-waterfalls-200: #c4d8e6;
  --color-veiling-waterfalls-300: #acc2d2;
  --color-veiling-waterfalls-400: #8ba4b5;
  --color-veiling-waterfalls-500: #70899a;
  --color-veiling-waterfalls-600: #576f7f;
  --color-veiling-waterfalls-700: #435867;
  --color-veiling-waterfalls-800: #324552;
  --color-veiling-waterfalls-900: #253540;
  --color-veiling-waterfalls-950: #152129;
}