Love Fumes to Royal Fig color palette

About this palette

Love Fumes to Royal Fig is a 5-color muted, warm, vintage palette: #FFD0D9 (Love Fumes), #DBB9A0 (Cosy Wool), #6DA6B0 (Seaside), #2F474C (Little Mermaid), #83555C (Royal Fig). It mixes pink, orange, turquoise, gray, red tones and feels warm overall. The strongest text pairing is #FFD0D9 on #2F474C with a contrast ratio of 7.18:1, and 2 of its 10 color pairs pass WCAG AA for normal text.

Color codes

ColorHEXRGBHSL
Love Fumesrgb(255, 208, 217)hsl(349, 100%, 91%)
Cosy Woolrgb(219, 185, 160)hsl(25, 45%, 74%)
Seasidergb(109, 166, 176)hsl(189, 30%, 56%)
Little Mermaidrgb(47, 71, 76)hsl(190, 24%, 24%)
Royal Figrgb(131, 85, 92)hsl(351, 21%, 42%)

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.

  • Aa7.18:1 Very good#FFD0D9 on #2F474C
  • Aa7.18:1 Very good#2F474C on #FFD0D9
  • Aa5.39:1 Good#DBB9A0 on #2F474C
  • Aa5.39:1 Good#2F474C on #DBB9A0
  • Aa4.47:1 Poor#FFD0D9 on #83555C
  • Aa4.47:1 Poor#83555C on #FFD0D9
  • Aa3.64:1 Poor#6DA6B0 on #2F474C
  • Aa3.64:1 Poor#2F474C on #6DA6B0

Color blindness preview

  • Protanopia
  • Deuteranopia
  • Tritanopia
  • Achromatopsia
  • Dog vision

CSS variables

/* Love Fumes to Royal Fig — https://swatchly.xyz/palette/ffd0d9-dbb9a0-6da6b0-2f474c-83555c */
:root {
  --love-fumes: #ffd0d9;
  --cosy-wool: #dbb9a0;
  --seaside: #6da6b0;
  --little-mermaid: #2f474c;
  --royal-fig: #83555c;
}

Tailwind CSS v4

/* Love Fumes to Royal Fig — https://swatchly.xyz/palette/ffd0d9-dbb9a0-6da6b0-2f474c-83555c */
@theme {
  --color-love-fumes: #ffd0d9;
  --color-love-fumes-50: #fff7f9;
  --color-love-fumes-100: #ffebef;
  --color-love-fumes-200: #ffd0d9;
  --color-love-fumes-300: #e1bbc2;
  --color-love-fumes-400: #c399a1;
  --color-love-fumes-500: #a67c85;
  --color-love-fumes-600: #896169;
  --color-love-fumes-700: #6f4b52;
  --color-love-fumes-800: #57383f;
  --color-love-fumes-900: #442a30;
  --color-love-fumes-950: #2c191d;
  --color-cosy-wool: #dbb9a0;
  --color-cosy-wool-50: #fff2e9;
  --color-cosy-wool-100: #fce6d6;
  --color-cosy-wool-200: #ecd2bf;
  --color-cosy-wool-300: #dbb9a0;
  --color-cosy-wool-400: #ba9a83;
  --color-cosy-wool-500: #9e7f67;
  --color-cosy-wool-600: #83654e;
  --color-cosy-wool-700: #6a4f3a;
  --color-cosy-wool-800: #543d2b;
  --color-cosy-wool-900: #422e1f;
  --color-cosy-wool-950: #2a1c11;
  --color-seaside: #6da6b0;
  --color-seaside-50: #dbf9ff;
  --color-seaside-100: #cbf0f6;
  --color-seaside-200: #b0dce4;
  --color-seaside-300: #93c5ce;
  --color-seaside-400: #6da6b0;
  --color-seaside-500: #538b95;
  --color-seaside-600: #3a717b;
  --color-seaside-700: #285b63;
  --color-seaside-800: #1a484f;
  --color-seaside-900: #10383e;
  --color-seaside-950: #072428;
  --color-little-mermaid: #2f474c;
  --color-little-mermaid-50: #e9f8fc;
  --color-little-mermaid-100: #deeff3;
  --color-little-mermaid-200: #c7dce0;
  --color-little-mermaid-300: #afc6cb;
  --color-little-mermaid-400: #8da7ac;
  --color-little-mermaid-500: #728b91;
  --color-little-mermaid-600: #587176;
  --color-little-mermaid-700: #435a5f;
  --color-little-mermaid-800: #2f474c;
  --color-little-mermaid-900: #25363a;
  --color-little-mermaid-950: #162224;
  --color-royal-fig: #83555c;
  --color-royal-fig-50: #fff1f3;
  --color-royal-fig-100: #ffe1e5;
  --color-royal-fig-200: #f1c8ce;
  --color-royal-fig-300: #ddafb5;
  --color-royal-fig-400: #be8d93;
  --color-royal-fig-500: #a07077;
  --color-royal-fig-600: #83555c;
  --color-royal-fig-700: #6a4248;
  --color-royal-fig-800: #543238;
  --color-royal-fig-900: #43262a;
  --color-royal-fig-950: #2b161a;
}

Similar palettes