Color Palettes

Butterscotch color

A golden orange-brown named after the classic candy made from butter and brown sugar. It feels cozy and nostalgic, and it suits fall sweaters, retro kitchens and leather accessories.

Also known as: Butterscotch yellow.

Open in editor

The hex code for butterscotch is #E3963E. In RGB it is rgb(227, 150, 62), in HSL hsl(32, 75%, 57%) and in CMYK 0, 34, 73, 11.

See it in real life

Pick a color to pair it with and see how it looks on clothes, interiors and design.

Colors similar to butterscotch

Bronze#CD7F32Sandy brown#F4A460Ochre#CC7722Honey#EBA937Carrot orange#ED9121Cadmium orange#ED872D

About butterscotch

Butterscotch (#E3963E) is a warm, mid-tone, highly saturated color. It belongs to the oranges family. It mixes 227 red, 150 green and 62 blue (out of 255). It is mostly used in fall fashion, retro decor, leather goods.

Swatch of Butterscotch with its shades from light to dark · #E3963E
Butterscotch · #E3963E

Butterscotch shades and tints

From lightest to darkest. Tap a shade to copy its code.

See all its shades: Color shades generator

Outfit colors by season and style80 palettes for men and women, each with 8 outfits to copy: quiet luxury, beach, mountain, office and more.See outfit palettes

Butterscotch color harmonies

Combinations based on the color wheel. More in the color harmony tool.

ComplementaryClose to: Cornflower blue
AnalogousClose to: Vermilion, Pear
TriadicClose to: Emerald green, Dark violet
Split complementaryClose to: Pool blue, Neon blue
TetradicClose to: Malachite, Cornflower blue, Bright purple

Butterscotch color palettes

Copy the codes or open a palette in the editor to tweak it.

Monochromatic palette · Butterscotch
Analogous palette · Butterscotch
Complementary palette · Butterscotch
Triadic palette · Butterscotch
With neutrals palette · Butterscotch
With an accent palette · Butterscotch

Butterscotch contrast with text

White textContrast 2.4:1 · Not recommended
Black textContrast 8.7:1 · AAA

Based on WCAG 2.1 guidelines. Test other pairs in the contrast checker.

CSS code

:root {
  --butterscotch: #E3963E;
  --butterscotch-rgb: 227, 150, 62;
}
.bg { background-color: var(--butterscotch); }
.text { color: var(--butterscotch); }

Colors similar to butterscotch

Pastel orangeCaramelMarigoldHarvest gold

Themed palettes with this color

Halloween color palettesDesert color palettesPatagonia color palettesMountain color palettesThanksgiving color palettesFriendsgiving color palettes

More oranges

OrangeTangerinePumpkin orangeCarrot orangeApricotPeachCoralTerracottaBurnt orangeSalmonRustCopperNeon orangePastel orangeOrange redPersimmonMangoBurnt siennaLight salmonDark orangeSafety orangeAtomic tangerineMelonLiving coral
Swatch of Butterscotch with its shades from light to dark · #E3963E
Swatch of Butterscotch with its shades from light to dark · #E3963E

Try this next

Name color paletteType a name and get your own color story paletteFamily birth flower bouquetEveryone's birth flowers in one bouquetBirthday Color PatternPlaids and stripes from your family's birthdays
See all free tools →

Frequently asked questions

What is the hex code for butterscotch?

The hex code for butterscotch is #E3963E. In RGB it is rgb(227, 150, 62), in HSL hsl(32, 75%, 57%) and in CMYK 0, 34, 73, 11.

What is the complementary color of butterscotch?

Its complement on the color wheel is #3E8BE3, close to cornflower blue. Used in small doses, it works as an accent and adds strong contrast.

Can you use white text on butterscotch?

Use black text instead: the contrast with white is only 2.4:1, while with black it is 8.7:1.