Ballerina to Broad Daylight Color Palette

About this palette

Ballerina to Broad Daylight is a 5-color pastel, light, cool palette: #F1D2E2 (Ballerina), #DBC488 (Sunspill), #A4F8F9 (Eternal Winter), #BBE4AA (Pastel Pea), #BCDDFF (Broad Daylight). It mixes pink, yellow, turquoise, green, blue tones and feels cool overall. The strongest text pairing is #DBC488 on #A4F8F9 with a contrast ratio of 1.42:1, and 0 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Ballerina	rgb(241, 210, 226)	hsl(329, 53%, 88%)
Sunspill	rgb(219, 196, 136)	hsl(43, 54%, 70%)
Eternal Winter	rgb(164, 248, 249)	hsl(181, 88%, 81%)
Pastel Pea	rgb(187, 228, 170)	hsl(102, 52%, 78%)
Broad Daylight	rgb(188, 221, 255)	hsl(210, 100%, 87%)

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

/* Ballerina to Broad Daylight — https://swatchly.xyz/palette/f1d2e2-dbc488-a4f8f9-bbe4aa-bcddff */
:root {
  --ballerina: #f1d2e2;
  --sunspill: #dbc488;
  --eternal-winter: #a4f8f9;
  --pastel-pea: #bbe4aa;
  --broad-daylight: #bcddff;
}

Tailwind CSS v4

/* Ballerina to Broad Daylight — https://swatchly.xyz/palette/f1d2e2-dbc488-a4f8f9-bbe4aa-bcddff */
@theme {
  --color-ballerina: #f1d2e2;
  --color-ballerina-50: #fff5fa;
  --color-ballerina-100: #fce9f3;
  --color-ballerina-200: #f1d2e2;
  --color-ballerina-300: #d6bcc9;
  --color-ballerina-400: #b79baa;
  --color-ballerina-500: #9b7f8e;
  --color-ballerina-600: #7f6472;
  --color-ballerina-700: #664e5b;
  --color-ballerina-800: #503b46;
  --color-ballerina-900: #3e2d36;
  --color-ballerina-950: #271b22;
  --color-sunspill: #dbc488;
  --color-sunspill-50: #fff7e3;
  --color-sunspill-100: #fceeca;
  --color-sunspill-200: #ebdbb0;
  --color-sunspill-300: #dbc488;
  --color-sunspill-400: #b9a46c;
  --color-sunspill-500: #9d874d;
  --color-sunspill-600: #816c32;
  --color-sunspill-700: #68541e;
  --color-sunspill-800: #52410f;
  --color-sunspill-900: #3f3106;
  --color-sunspill-950: #281e01;
  --color-eternal-winter: #a4f8f9;
  --color-eternal-winter-50: #cefcfc;
  --color-eternal-winter-100: #a4f8f9;
  --color-eternal-winter-200: #a4e1e1;
  --color-eternal-winter-300: #86cccd;
  --color-eternal-winter-400: #5fafb0;
  --color-eternal-winter-500: #3f9495;
  --color-eternal-winter-600: #21797b;
  --color-eternal-winter-700: #056263;
  --color-eternal-winter-800: #004d4e;
  --color-eternal-winter-900: #003b3c;
  --color-eternal-winter-950: #002526;
  --color-pastel-pea: #bbe4aa;
  --color-pastel-pea-50: #e5fcdc;
  --color-pastel-pea-100: #d9f3ce;
  --color-pastel-pea-200: #bbe4aa;
  --color-pastel-pea-300: #a9cc9b;
  --color-pastel-pea-400: #88ad78;
  --color-pastel-pea-500: #6c925c;
  --color-pastel-pea-600: #537743;
  --color-pastel-pea-700: #3f5f30;
  --color-pastel-pea-800: #2f4b22;
  --color-pastel-pea-900: #223a17;
  --color-pastel-pea-950: #13250b;
  --color-broad-daylight: #bcddff;
  --color-broad-daylight-50: #f0f7ff;
  --color-broad-daylight-100: #dfefff;
  --color-broad-daylight-200: #bcddff;
  --color-broad-daylight-300: #aac5e2;
  --color-broad-daylight-400: #88a6c5;
  --color-broad-daylight-500: #6c8aa9;
  --color-broad-daylight-600: #526f8d;
  --color-broad-daylight-700: #3e5873;
  --color-broad-daylight-800: #2d445c;
  --color-broad-daylight-900: #213548;
  --color-broad-daylight-950: #12202f;
}