Lovely Breeze to Twilight Zone color palette

F5D8E6Lovely Breeze CEA6C2Novel Lilac 74846AWreath 2D595CDeep Sea Diver 151912Twilight Zone

About this palette

Lovely Breeze to Twilight Zone is a 5-color muted, vintage palette: #F5D8E6 (Lovely Breeze), #CEA6C2 (Novel Lilac), #74846A (Wreath), #2D595C (Deep Sea Diver), #151912 (Twilight Zone). It mixes pink, green, turquoise, black tones and feels balanced overall. The strongest text pairing is #F5D8E6 on #151912 with a contrast ratio of 13.43:1, and 3 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Lovely Breeze	rgb(245, 216, 230)	hsl(331, 59%, 90%)
Novel Lilac	rgb(206, 166, 194)	hsl(318, 29%, 73%)
Wreath	rgb(116, 132, 106)	hsl(97, 11%, 47%)
Deep Sea Diver	rgb(45, 89, 92)	hsl(184, 34%, 27%)
Twilight Zone	rgb(21, 25, 18)	hsl(94, 16%, 8%)

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.

Aa13.43:1 Super#F5D8E6 on #151912
Aa13.43:1 Super#151912 on #F5D8E6
Aa8.36:1 Very good#CEA6C2 on #151912
Aa8.36:1 Very good#151912 on #CEA6C2
Aa5.88:1 Good#F5D8E6 on #2D595C
Aa5.88:1 Good#2D595C on #F5D8E6
Aa4.45:1 Poor#74846A on #151912
Aa4.45:1 Poor#151912 on #74846A

Color blindness preview

CSS variables

/* Lovely Breeze to Twilight Zone — https://swatchly.xyz/palette/f5d8e6-cea6c2-74846a-2d595c-151912 */
:root {
  --lovely-breeze: #f5d8e6;
  --novel-lilac: #cea6c2;
  --wreath: #74846a;
  --deep-sea-diver: #2d595c;
  --twilight-zone: #151912;
}

Tailwind CSS v4

/* Lovely Breeze to Twilight Zone — https://swatchly.xyz/palette/f5d8e6-cea6c2-74846a-2d595c-151912 */
@theme {
  --color-lovely-breeze: #f5d8e6;
  --color-lovely-breeze-50: #f9e7f0;
  --color-lovely-breeze-100: #f5d8e6;
  --color-lovely-breeze-200: #dfc8d3;
  --color-lovely-breeze-300: #cbb3bf;
  --color-lovely-breeze-400: #af94a1;
  --color-lovely-breeze-500: #957b87;
  --color-lovely-breeze-600: #7b626e;
  --color-lovely-breeze-700: #644e59;
  --color-lovely-breeze-800: #4f3c45;
  --color-lovely-breeze-900: #3e2d35;
  --color-lovely-breeze-950: #271b21;
  --color-novel-lilac: #cea6c2;
  --color-novel-lilac-50: #ffe6f7;
  --color-novel-lilac-100: #f5d9ec;
  --color-novel-lilac-200: #e2c1d8;
  --color-novel-lilac-300: #cea6c2;
  --color-novel-lilac-400: #b08aa4;
  --color-novel-lilac-500: #96718b;
  --color-novel-lilac-600: #7c5972;
  --color-novel-lilac-700: #65465c;
  --color-novel-lilac-800: #52364a;
  --color-novel-lilac-900: #422a3b;
  --color-novel-lilac-950: #2a1925;
  --color-wreath: #74846a;
  --color-wreath-50: #edf7e7;
  --color-wreath-100: #e1edda;
  --color-wreath-200: #cbd8c2;
  --color-wreath-300: #b2c1a8;
  --color-wreath-400: #90a186;
  --color-wreath-500: #74846a;
  --color-wreath-600: #5c6b52;
  --color-wreath-700: #48553f;
  --color-wreath-800: #374330;
  --color-wreath-900: #2a3424;
  --color-wreath-950: #1a2115;
  --color-deep-sea-diver: #2d595c;
  --color-deep-sea-diver-50: #e1fbfd;
  --color-deep-sea-diver-100: #d5f2f4;
  --color-deep-sea-diver-200: #bcdee1;
  --color-deep-sea-diver-300: #a0c8ca;
  --color-deep-sea-diver-400: #7ca8ab;
  --color-deep-sea-diver-500: #5f8c8f;
  --color-deep-sea-diver-600: #467073;
  --color-deep-sea-diver-700: #2d595c;
  --color-deep-sea-diver-800: #234548;
  --color-deep-sea-diver-900: #183637;
  --color-deep-sea-diver-950: #0c2123;
  --color-twilight-zone: #151912;
  --color-twilight-zone-50: #f3f6f1;
  --color-twilight-zone-100: #e9ece6;
  --color-twilight-zone-200: #d5d9d2;
  --color-twilight-zone-300: #bec3ba;
  --color-twilight-zone-400: #9ea39a;
  --color-twilight-zone-500: #81867d;
  --color-twilight-zone-600: #656a62;
  --color-twilight-zone-700: #4e524b;
  --color-twilight-zone-800: #3a3e37;
  --color-twilight-zone-900: #2a2d28;
  --color-twilight-zone-950: #151912;
}