Start generating

Fabulous Fawn to Vin Cuit color palette

E5C2ACFabulous Fawn174558Capital BlueDBF6FFWaterD89F7DBlushing Rose0F6382Harem SilkB1765CVin Cuit
Open in generator Export PNG, PDF, ASE…

About this palette

Fabulous Fawn to Vin Cuit is a 6-color vintage palette: #E5C2AC (Fabulous Fawn), #174558 (Capital Blue), #DBF6FF (Water), #D89F7D (Blushing Rose), #0F6382 (Harem Silk), #B1765C (Vin Cuit). It mixes orange, blue, white tones and feels warm overall. The strongest text pairing is #174558 on #DBF6FF with a contrast ratio of 9.19:1, and 4 of its 15 color pairs pass WCAG AA for normal text.

Color codes

ColorHEXRGBHSL
Fabulous Fawnrgb(229, 194, 172)hsl(23, 52%, 79%)
Capital Bluergb(23, 69, 88)hsl(198, 59%, 22%)
Waterrgb(219, 246, 255)hsl(195, 100%, 93%)
Blushing Rosergb(216, 159, 125)hsl(22, 54%, 67%)
Harem Silkrgb(15, 99, 130)hsl(196, 79%, 28%)
Vin Cuitrgb(177, 118, 92)hsl(18, 35%, 53%)

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.19:1 Very good#174558 on #DBF6FF
  • Aa9.19:1 Very good#DBF6FF on #174558
  • Aa6.23:1 Good#E5C2AC on #174558
  • Aa6.23:1 Good#174558 on #E5C2AC
  • Aa5.96:1 Good#DBF6FF on #0F6382
  • Aa5.96:1 Good#0F6382 on #DBF6FF
  • Aa4.52:1 Good#174558 on #D89F7D
  • Aa4.52:1 Good#D89F7D on #174558

Color blindness preview

  • Protanopia
  • Deuteranopia
  • Tritanopia
  • Achromatopsia
  • Dog vision

CSS variables

/* Fabulous Fawn to Vin Cuit — https://swatchly.xyz/palette/e5c2ac-174558-dbf6ff-d89f7d-0f6382-b1765c */
:root {
  --fabulous-fawn: #e5c2ac;
  --capital-blue: #174558;
  --water: #dbf6ff;
  --blushing-rose: #d89f7d;
  --harem-silk: #0f6382;
  --vin-cuit: #b1765c;
}

Tailwind CSS v4

/* Fabulous Fawn to Vin Cuit — https://swatchly.xyz/palette/e5c2ac-174558-dbf6ff-d89f7d-0f6382-b1765c */
@theme {
  --color-fabulous-fawn: #e5c2ac;
  --color-fabulous-fawn-50: #fff8f4;
  --color-fabulous-fawn-100: #ffeee3;
  --color-fabulous-fawn-200: #f3daca;
  --color-fabulous-fawn-300: #e5c2ac;
  --color-fabulous-fawn-400: #c1a18d;
  --color-fabulous-fawn-500: #a58470;
  --color-fabulous-fawn-600: #876855;
  --color-fabulous-fawn-700: #6d513f;
  --color-fabulous-fawn-800: #563e2e;
  --color-fabulous-fawn-900: #422e21;
  --color-fabulous-fawn-950: #2a1c12;
  --color-capital-blue: #174558;
  --color-capital-blue-50: #e9f8ff;
  --color-capital-blue-100: #d3f1ff;
  --color-capital-blue-200: #bbdeef;
  --color-capital-blue-300: #9fc7db;
  --color-capital-blue-400: #7ba8bd;
  --color-capital-blue-500: #5e8ca1;
  --color-capital-blue-600: #457084;
  --color-capital-blue-700: #30586a;
  --color-capital-blue-800: #174558;
  --color-capital-blue-900: #173442;
  --color-capital-blue-950: #0b202a;
  --color-water: #dbf6ff;
  --color-water-50: #dbf6ff;
  --color-water-100: #daebf1;
  --color-water-200: #c5d8df;
  --color-water-300: #adc3cb;
  --color-water-400: #8da5ad;
  --color-water-500: #728a92;
  --color-water-600: #597078;
  --color-water-700: #445960;
  --color-water-800: #33464c;
  --color-water-900: #26363b;
  --color-water-950: #162125;
  --color-blushing-rose: #d89f7d;
  --color-blushing-rose-50: #fff8f4;
  --color-blushing-rose-100: #ffeee4;
  --color-blushing-rose-200: #ffd6bf;
  --color-blushing-rose-300: #efc0a4;
  --color-blushing-rose-400: #d89f7d;
  --color-blushing-rose-500: #b88261;
  --color-blushing-rose-600: #996545;
  --color-blushing-rose-700: #7d4d2f;
  --color-blushing-rose-800: #633a1f;
  --color-blushing-rose-900: #4d2a14;
  --color-blushing-rose-950: #311808;
  --color-harem-silk: #0f6382;
  --color-harem-silk-50: #eaf8ff;
  --color-harem-silk-100: #d4f0ff;
  --color-harem-silk-200: #ade1fb;
  --color-harem-silk-300: #90cdea;
  --color-harem-silk-400: #6aafcf;
  --color-harem-silk-500: #4b94b5;
  --color-harem-silk-600: #2f7a99;
  --color-harem-silk-700: #0f6382;
  --color-harem-silk-800: #064e67;
  --color-harem-silk-900: #003c51;
  --color-harem-silk-950: #002534;
  --color-vin-cuit: #b1765c;
  --color-vin-cuit-50: #fff2ed;
  --color-vin-cuit-100: #ffe5da;
  --color-vin-cuit-200: #fcccb7;
  --color-vin-cuit-300: #e9b39c;
  --color-vin-cuit-400: #cd9278;
  --color-vin-cuit-500: #b1765c;
  --color-vin-cuit-600: #945c43;
  --color-vin-cuit-700: #794730;
  --color-vin-cuit-800: #613521;
  --color-vin-cuit-900: #4d2817;
  --color-vin-cuit-950: #32170b;
}

Similar palettes