Start generating

Snow White to British Racing Green color palette

E8FFE8Snow WhiteC4ACFFLilacD6629CFlirty Rose785D90Muted Purple004C1EBritish Racing Green
Open in generator Export PNG, PDF, ASE…

About this palette

Snow White to British Racing Green is a 5-color cool palette: #E8FFE8 (Snow White), #C4ACFF (Lilac), #D6629C (Flirty Rose), #785D90 (Muted Purple), #004C1E (British Racing Green). It mixes white, purple, pink, green tones and feels cool overall. The strongest text pairing is #E8FFE8 on #004C1E with a contrast ratio of 9.70:1, and 3 of its 10 color pairs pass WCAG AA for normal text.

Color codes

ColorHEXRGBHSL
Snow Whitergb(232, 255, 232)hsl(120, 100%, 95%)
Lilacrgb(196, 172, 255)hsl(257, 100%, 84%)
Flirty Rosergb(214, 98, 156)hsl(330, 59%, 61%)
Muted Purplergb(120, 93, 144)hsl(272, 22%, 46%)
British Racing Greenrgb(0, 76, 30)hsl(144, 100%, 15%)

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.70:1 Very good#E8FFE8 on #004C1E
  • Aa9.70:1 Very good#004C1E on #E8FFE8
  • Aa5.28:1 Good#E8FFE8 on #785D90
  • Aa5.28:1 Good#785D90 on #E8FFE8
  • Aa5.21:1 Good#C4ACFF on #004C1E
  • Aa5.21:1 Good#004C1E on #C4ACFF
  • Aa3.27:1 Poor#E8FFE8 on #D6629C
  • Aa3.27:1 Poor#D6629C on #E8FFE8

Color blindness preview

  • Protanopia
  • Deuteranopia
  • Tritanopia
  • Achromatopsia
  • Dog vision

CSS variables

/* Snow White to British Racing Green — https://swatchly.xyz/palette/e8ffe8-c4acff-d6629c-785d90-004c1e */
:root {
  --snow-white: #e8ffe8;
  --lilac: #c4acff;
  --flirty-rose: #d6629c;
  --muted-purple: #785d90;
  --british-racing-green: #004c1e;
}

Tailwind CSS v4

/* Snow White to British Racing Green — https://swatchly.xyz/palette/e8ffe8-c4acff-d6629c-785d90-004c1e */
@theme {
  --color-snow-white: #e8ffe8;
  --color-snow-white-50: #e8ffe8;
  --color-snow-white-100: #e4f2e4;
  --color-snow-white-200: #cedece;
  --color-snow-white-300: #b5c8b5;
  --color-snow-white-400: #94a994;
  --color-snow-white-500: #788d79;
  --color-snow-white-600: #5e725f;
  --color-snow-white-700: #495b49;
  --color-snow-white-800: #384738;
  --color-snow-white-900: #2a372a;
  --color-snow-white-950: #192219;
  --color-lilac: #c4acff;
  --color-lilac-50: #f4f0ff;
  --color-lilac-100: #eae3ff;
  --color-lilac-200: #d8caff;
  --color-lilac-300: #c4acff;
  --color-lilac-400: #a58edc;
  --color-lilac-500: #8b73c1;
  --color-lilac-600: #715aa4;
  --color-lilac-700: #5b4588;
  --color-lilac-800: #48346f;
  --color-lilac-900: #382759;
  --color-lilac-950: #23173b;
  --color-flirty-rose: #d6629c;
  --color-flirty-rose-50: #fff3f8;
  --color-flirty-rose-100: #ffe8f1;
  --color-flirty-rose-200: #ffcde2;
  --color-flirty-rose-300: #ffabd1;
  --color-flirty-rose-400: #ef80b6;
  --color-flirty-rose-500: #d6629c;
  --color-flirty-rose-600: #b5457f;
  --color-flirty-rose-700: #962d66;
  --color-flirty-rose-800: #791c50;
  --color-flirty-rose-900: #5f0f3d;
  --color-flirty-rose-950: #3e0526;
  --color-muted-purple: #785d90;
  --color-muted-purple-50: #f8f2ff;
  --color-muted-purple-100: #f2e5ff;
  --color-muted-purple-200: #e2cdf7;
  --color-muted-purple-300: #cdb4e5;
  --color-muted-purple-400: #af93c8;
  --color-muted-purple-500: #9377ac;
  --color-muted-purple-600: #785d90;
  --color-muted-purple-700: #604875;
  --color-muted-purple-800: #4c375e;
  --color-muted-purple-900: #3b294a;
  --color-muted-purple-950: #251830;
  --color-british-racing-green: #004c1e;
  --color-british-racing-green-50: #dfffe4;
  --color-british-racing-green-100: #cff8d5;
  --color-british-racing-green-200: #b5e6bd;
  --color-british-racing-green-300: #98d0a2;
  --color-british-racing-green-400: #73b17f;
  --color-british-racing-green-500: #549562;
  --color-british-racing-green-600: #3a7849;
  --color-british-racing-green-700: #265f35;
  --color-british-racing-green-800: #004c1e;
  --color-british-racing-green-900: #0d391a;
  --color-british-racing-green-950: #05240e;
}

Similar palettes