Frosted Fir to Blond color palette

AFD2C1Frosted Fir A5E6EBBlizzard Blue FCCC99Apricot Sherbet FFE7DDSlightly in Love F1F3BEBlond

About this palette

Frosted Fir to Blond is a 5-color pastel, light palette: #AFD2C1 (Frosted Fir), #A5E6EB (Blizzard Blue), #FCCC99 (Apricot Sherbet), #FFE7DD (Slightly in Love), #F1F3BE (Blond). It mixes green, turquoise, orange, white, yellow tones and feels balanced overall. The strongest text pairing is #AFD2C1 on #F1F3BE with a contrast ratio of 1.43:1, and 0 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Frosted Fir	rgb(175, 210, 193)	hsl(151, 28%, 75%)
Blizzard Blue	rgb(165, 230, 235)	hsl(184, 64%, 78%)
Apricot Sherbet	rgb(252, 204, 153)	hsl(31, 94%, 79%)
Slightly in Love	rgb(255, 231, 221)	hsl(18, 100%, 93%)
Blond	rgb(241, 243, 190)	hsl(62, 69%, 85%)

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

/* Frosted Fir to Blond — https://swatchly.xyz/palette/afd2c1-a5e6eb-fccc99-ffe7dd-f1f3be */
:root {
  --frosted-fir: #afd2c1;
  --blizzard-blue: #a5e6eb;
  --apricot-sherbet: #fccc99;
  --slightly-in-love: #ffe7dd;
  --blond: #f1f3be;
}

Tailwind CSS v4

/* Frosted Fir to Blond — https://swatchly.xyz/palette/afd2c1-a5e6eb-fccc99-ffe7dd-f1f3be */
@theme {
  --color-frosted-fir: #afd2c1;
  --color-frosted-fir-50: #ecfef5;
  --color-frosted-fir-100: #e2f6ec;
  --color-frosted-fir-200: #cce5d9;
  --color-frosted-fir-300: #afd2c1;
  --color-frosted-fir-400: #90b0a1;
  --color-frosted-fir-500: #739484;
  --color-frosted-fir-600: #587869;
  --color-frosted-fir-700: #425f51;
  --color-frosted-fir-800: #304a3e;
  --color-frosted-fir-900: #23382e;
  --color-frosted-fir-950: #14231c;
  --color-blizzard-blue: #a5e6eb;
  --color-blizzard-blue-50: #defdff;
  --color-blizzard-blue-100: #cef5f8;
  --color-blizzard-blue-200: #a5e6eb;
  --color-blizzard-blue-300: #97cdd1;
  --color-blizzard-blue-400: #72aeb3;
  --color-blizzard-blue-500: #539397;
  --color-blizzard-blue-600: #39777c;
  --color-blizzard-blue-700: #245f64;
  --color-blizzard-blue-800: #154b4f;
  --color-blizzard-blue-900: #0b3a3d;
  --color-blizzard-blue-950: #042427;
  --color-apricot-sherbet: #fccc99;
  --color-apricot-sherbet-50: #fff2e4;
  --color-apricot-sherbet-100: #ffe5ca;
  --color-apricot-sherbet-200: #fccc99;
  --color-apricot-sherbet-300: #e0b78d;
  --color-apricot-sherbet-400: #c39768;
  --color-apricot-sherbet-500: #a87c4b;
  --color-apricot-sherbet-600: #8b6232;
  --color-apricot-sherbet-700: #724c1f;
  --color-apricot-sherbet-800: #5b3a11;
  --color-apricot-sherbet-900: #482c08;
  --color-apricot-sherbet-950: #2e1a02;
  --color-slightly-in-love: #ffe7dd;
  --color-slightly-in-love-50: #fff4ef;
  --color-slightly-in-love-100: #ffe7dd;
  --color-slightly-in-love-200: #e6d5cd;
  --color-slightly-in-love-300: #d1bdb5;
  --color-slightly-in-love-400: #b29d94;
  --color-slightly-in-love-500: #978178;
  --color-slightly-in-love-600: #7b675e;
  --color-slightly-in-love-700: #635149;
  --color-slightly-in-love-800: #4e3e38;
  --color-slightly-in-love-900: #3d2f2a;
  --color-slightly-in-love-950: #261d19;
  --color-blond: #f1f3be;
  --color-blond-50: #f9fadf;
  --color-blond-100: #f1f3be;
  --color-blond-200: #dcddb8;
  --color-blond-300: #c5c79c;
  --color-blond-400: #a5a777;
  --color-blond-500: #8a8b5a;
  --color-blond-600: #6f7040;
  --color-blond-700: #58582d;
  --color-blond-800: #44451e;
  --color-blond-900: #353514;
  --color-blond-950: #212109;
}