Too Blue to Be True to Wondrous Wisteria color palette

008EF4Too Blue to Be True 925FD3Legendary Lavender 2F2E74Twilight Express C0E5FFBreaking the Ice 5B4A7ESumptuous Purple 9AAEEDWondrous Wisteria

Open in generator Export PNG, PDF, ASE…

About this palette

Too Blue to Be True to Wondrous Wisteria is a 6-color cool palette: #008EF4 (Too Blue to Be True), #925FD3 (Legendary Lavender), #2F2E74 (Twilight Express), #C0E5FF (Breaking the Ice), #5B4A7E (Sumptuous Purple), #9AAEED (Wondrous Wisteria). It mixes blue, purple tones and feels cool overall. The strongest text pairing is #2F2E74 on #C0E5FF with a contrast ratio of 9.01:1, and 3 of its 15 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Too Blue to Be True	rgb(0, 142, 244)	hsl(205, 100%, 48%)
Legendary Lavender	rgb(146, 95, 211)	hsl(266, 57%, 60%)
Twilight Express	rgb(47, 46, 116)	hsl(241, 43%, 32%)
Breaking the Ice	rgb(192, 229, 255)	hsl(205, 100%, 88%)
Sumptuous Purple	rgb(91, 74, 126)	hsl(260, 26%, 39%)
Wondrous Wisteria	rgb(154, 174, 237)	hsl(226, 70%, 77%)

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.

Aa9.01:1 Very good#2F2E74 on #C0E5FF
Aa9.01:1 Very good#C0E5FF on #2F2E74
Aa5.83:1 Good#C0E5FF on #5B4A7E
Aa5.83:1 Good#5B4A7E on #C0E5FF
Aa5.47:1 Good#2F2E74 on #9AAEED
Aa5.47:1 Good#9AAEED on #2F2E74
Aa3.54:1 Poor#5B4A7E on #9AAEED
Aa3.54:1 Poor#9AAEED on #5B4A7E

Color blindness preview

CSS variables

/* Too Blue to Be True to Wondrous Wisteria — https://swatchly.xyz/palette/008ef4-925fd3-2f2e74-c0e5ff-5b4a7e-9aaeed */
:root {
  --too-blue-to-be-true: #008ef4;
  --legendary-lavender: #925fd3;
  --twilight-express: #2f2e74;
  --breaking-the-ice: #c0e5ff;
  --sumptuous-purple: #5b4a7e;
  --wondrous-wisteria: #9aaeed;
}

Tailwind CSS v4

/* Too Blue to Be True to Wondrous Wisteria — https://swatchly.xyz/palette/008ef4-925fd3-2f2e74-c0e5ff-5b4a7e-9aaeed */
@theme {
  --color-too-blue-to-be-true: #008ef4;
  --color-too-blue-to-be-true-50: #f0f7ff;
  --color-too-blue-to-be-true-100: #e0efff;
  --color-too-blue-to-be-true-200: #bfdeff;
  --color-too-blue-to-be-true-300: #97caff;
  --color-too-blue-to-be-true-400: #55abff;
  --color-too-blue-to-be-true-500: #008ef4;
  --color-too-blue-to-be-true-600: #0072c6;
  --color-too-blue-to-be-true-700: #005a9e;
  --color-too-blue-to-be-true-800: #00467d;
  --color-too-blue-to-be-true-900: #003562;
  --color-too-blue-to-be-true-950: #00213f;
  --color-legendary-lavender: #925fd3;
  --color-legendary-lavender-50: #f6f1ff;
  --color-legendary-lavender-100: #ede3ff;
  --color-legendary-lavender-200: #dcc8ff;
  --color-legendary-lavender-300: #caa7ff;
  --color-legendary-lavender-400: #ae7df1;
  --color-legendary-lavender-500: #925fd3;
  --color-legendary-lavender-600: #7846b4;
  --color-legendary-lavender-700: #613297;
  --color-legendary-lavender-800: #4e237c;
  --color-legendary-lavender-900: #3d1864;
  --color-legendary-lavender-950: #270c43;
  --color-twilight-express: #2f2e74;
  --color-twilight-express-50: #f3f4ff;
  --color-twilight-express-100: #e6eaff;
  --color-twilight-express-200: #ced4ff;
  --color-twilight-express-300: #b3bbff;
  --color-twilight-express-400: #949be8;
  --color-twilight-express-500: #7a80ce;
  --color-twilight-express-600: #6267b1;
  --color-twilight-express-700: #4e5196;
  --color-twilight-express-800: #3d407d;
  --color-twilight-express-900: #2f2e74;
  --color-twilight-express-950: #1e1f47;
  --color-breaking-the-ice: #c0e5ff;
  --color-breaking-the-ice-50: #f6fbff;
  --color-breaking-the-ice-100: #e5f4ff;
  --color-breaking-the-ice-200: #c0e5ff;
  --color-breaking-the-ice-300: #aecce1;
  --color-breaking-the-ice-400: #8aabc3;
  --color-breaking-the-ice-500: #6c8fa6;
  --color-breaking-the-ice-600: #527389;
  --color-breaking-the-ice-700: #3c5a6f;
  --color-breaking-the-ice-800: #2b4657;
  --color-breaking-the-ice-900: #1f3645;
  --color-breaking-the-ice-950: #11212c;
  --color-sumptuous-purple: #5b4a7e;
  --color-sumptuous-purple-50: #f6f3ff;
  --color-sumptuous-purple-100: #ede7ff;
  --color-sumptuous-purple-200: #dccffc;
  --color-sumptuous-purple-300: #c6b7ea;
  --color-sumptuous-purple-400: #a797ce;
  --color-sumptuous-purple-500: #8c7bb3;
  --color-sumptuous-purple-600: #716196;
  --color-sumptuous-purple-700: #5b4a7e;
  --color-sumptuous-purple-800: #473963;
  --color-sumptuous-purple-900: #372b4e;
  --color-sumptuous-purple-950: #221a33;
  --color-wondrous-wisteria: #9aaeed;
  --color-wondrous-wisteria-50: #f9faff;
  --color-wondrous-wisteria-100: #eff3ff;
  --color-wondrous-wisteria-200: #d7e1ff;
  --color-wondrous-wisteria-300: #bcccff;
  --color-wondrous-wisteria-400: #9aaeed;
  --color-wondrous-wisteria-500: #7d8fcc;
  --color-wondrous-wisteria-600: #6072ac;
  --color-wondrous-wisteria-700: #49598e;
  --color-wondrous-wisteria-800: #364372;
  --color-wondrous-wisteria-900: #273259;
  --color-wondrous-wisteria-950: #161d39;
}