Huebook

Vanilla Sugar Analogous Color Scheme

Five colors arranged by the analogous rule around Vanilla Sugar (#F1E8DC), each snapped to its nearest named color.

#F0DCE3
#F0DEDC
#F1E8DC
#F2F1DC
#E6F1DE

Color names and codes

NameHEXRGBHSLCMYKOKLCH
Piggyback#F0DCE3240, 220, 227339°, 40%, 90%0, 8, 5, 691.3% 0.024 354
Butterfly Kisses#F0DEDC240, 222, 2206°, 40%, 90%0, 7, 8, 691.5% 0.020 25
Vanilla Sugar#F1E8DC241, 232, 22034°, 43%, 90%0, 4, 9, 593.5% 0.019 75
Hazy Grove#F2F1DC242, 241, 22057°, 46%, 91%0, 0, 9, 595.3% 0.028 105
Lower Lime#E6F1DE230, 241, 22295°, 40%, 91%5, 0, 8, 594.5% 0.028 132

Which pairs work for text

Text on backgroundContrastWCAG
Aa #F0DCE3 on #F2F1DC1.15:1—
Aa #F0DEDC on #F2F1DC1.14:1—
Aa #F0DCE3 on #E6F1DE1.12:1—
Aa #F0DEDC on #E6F1DE1.11:1—
Aa #F0DCE3 on #F1E8DC1.08:1—
Aa #F0DEDC on #F1E8DC1.07:1—

CSS variables

:root {
  --color-1: #f0dce3; /* Piggyback */
  --color-2: #f0dedc; /* Butterfly Kisses */
  --color-3: #f1e8dc; /* Vanilla Sugar */
  --color-4: #f2f1dc; /* Hazy Grove */
  --color-5: #e6f1de; /* Lower Lime */
}

Other schemes from Vanilla Sugar

More very light orange analogous color schemes

Questions

What colors go with Vanilla Sugar?

In a analogous scheme: Piggyback (#F0DCE3), Butterfly Kisses (#F0DEDC), Hazy Grove (#F2F1DC), Lower Lime (#E6F1DE).

What is the hex code of Vanilla Sugar?

#F1E8DC.