Color Directory

Cream

A pale warm yellow-white, softer than off white.

#FFFDD0
HEX
#FFFDD0
RGB
rgb(255, 253, 208)
HSL
hsl(57, 100%, 91%)

Check Cream

Contrast ratios against white and black text.

Cream in use
Cream in use
White text on this colour1.04:1Fail
Black text on this colour20.21:1AAA

WCAG asks for 4.5:1 on body text and 3:1 on text 24px or larger. Ratios are calculated from #FFFDD0 in the sRGB colour space.

About this entry

What it is

A pale warm yellow-white, softer than off white.

Stationery, food packaging and vintage layouts.

Copy & use

How to copy and use cream

  1. 01

    Copy the complete value

    Use the copy button above so the value is captured without its label, description or surrounding page text.

  2. 02

    Paste it where you need it

    Stationery, food packaging and vintage layouts.

  3. 03

    Check the final result

    Modern browsers support hex, RGB and HSL. Screens, colour profiles and neighbouring colours can still make the same value appear different, so evaluate it in the intended interface.

Tints & shades

A scale built from cream

Each step is mixed toward white or black from #FFFDD0 in sRGB, which is what the browser does too. Useful when one colour has to cover hover states, borders and backgrounds as well as the accent itself.

  • Lighter 60%

    #FFFEEC

    rgb(255, 254, 236)

  • Lighter 30%

    #FFFEDE

    rgb(255, 254, 222)

  • Base

    Base

    #FFFDD0

    rgb(255, 253, 208)

  • Darker 30%

    #B3B192

    rgb(179, 177, 146)

  • Darker 60%

    #666553

    rgb(102, 101, 83)

Name & pairing

Where cream comes from

The colour of dairy cream, and one of the few names that describes a texture as much as a hue. The yellow in it is what separates it from off-white, which is closer to neutral.

What to put beside it

A warmer page ground than off-white and a good base for anything earthy. It fights slightly with cool greys, which will look blue by comparison.

Common questions

Using cream

What is cream?

A pale warm yellow-white, softer than off white. Stationery, food packaging and vintage layouts.

What are the colour values for Cream?

Cream is HEX #FFFDD0, RGB rgb(255, 253, 208), HSL hsl(57, 100%, 91%). All three notations describe the same sRGB colour, so pick whichever your tool expects: hex for CSS and design files, RGB when you need the channels separately, HSL when you want to shift lightness or saturation without changing the hue.

Will cream work everywhere?

Modern browsers support hex, RGB and HSL. Screens, colour profiles and neighbouring colours can still make the same value appear different, so evaluate it in the intended interface.

Can I customise cream after copying?

Use the supplied value as a starting point, then check contrast and nearby colours in the final design. Converting between hex, RGB and HSL does not change the intended sRGB colour.

Also known as

cream hex codeivory colorcream rgb

Keep browsing

More color directory