Skip to main content

Puce

Everything you need to know about puce to inspire your next design.

Get color palette

Hex

RGB

HSB

HSL

Pick palette settings

Custom palettes

Puce is a deep, rich color that conveys a sense of antique elegance and depth. Positioned between brown and dark red (and closer to red) on the color wheel, it has a warm undertone. Its hues range from dark maroon to a muted burgundy.

puce colorpuce color

Puce is defined by the following color codes and values to ensure consistency across various digital platforms and devices.

- HEX code: #E491A6

- RGB value: 89.4% red, 56.9% green and 65.1% blue

Accessibility considerations play a crucial role in UX and UI design color choices. Figma offers plugins in the Community to make sure your designs meet Web Content Accessibility Guidelines.

While puce can be an interesting color choice, it has limitations in UI design due to its relative obscurity and potential for misinterpretation. Here are some things to consider:

  • Use sparingly as an accent. A small amount of puce can add a unique touch to a design, but avoid using it as a dominant color. Consider using it for buttons, accents, or subtle highlights to draw attention without overwhelming the user.
  • Pair with clear and readable colors. Because puce can be on the darker side, ensure it's paired with clear and contrasting colors for optimal readability. White, black, or lighter grays are safe for backgrounds or primary text.
  • Consider your audience. Puce might not be suitable for all audiences or brand personalities. It might work for a sophisticated brand aiming for unconventional elegance. It would not be ideal for a playful or youthful brand.
  • Test thoroughly. Due to puce's potential for negative connotations, thoroughly test your UI design with users. Get feedback on how they perceive the color and whether it evokes the desired emotions.

Keep in mind that color and its meaning can change from culture to culture—and at any given time. If you are designing for a global audience, research color considerations for your specific regions.

Puce sits in a unique position, blending pink's softness with a touch of earthy brown. Variations within this distinctive spectrum include:

  • Dusty Rose (#DCA1A1) offers a lighter, more subdued pink, echoing puce's softness with a touch of warmth.
  • Mauve (#E0AFFF) presents a more purple-infused counterpart, sharing puce's understated elegance.
  • Rosewood (#65000B) dives into a darker, richer territory, retaining the sophistication of puce with added depth.
  • Terra cotta (#E2725B) brings in an earthy, reddish tone, similar to puce but with a sunnier disposition.

To complement puce's muted elegance, consider pairing it with:

  • Sage green (#9EAB8A) for a natural and understated elegance, creating a serene and balanced palette.
  • Navy blue (#000080) adds a classic depth, contrasting beautifully with puce's soft warmth.
  • Champagne (#F7E6CA) offers a light, neutral backdrop that allows puce to stand out subtly.
  • Slate gray (#6D8196) provides a modern and sophisticated contrast, highlighting puce's unique hue.
  • Cream (#FDFBD4) for a soft and harmonious combination, perfect for a gentle and inviting space.

Other colors worth considering include deep teal for a rich contrast, silver for a sleek modern look, and lavender for a playful yet refined palette.

While puce is versatile, it may not harmonize well with:

  • Bright yellow (#FFFF00) can overpower puce's subtlety, creating a visually jarring combination.
  • Lime green (#89F336) might be too vibrant, overshadowing the understated elegance of puce.
  • Neon orange (#FF6A00) offers a clash of warmth, potentially unsettling the balance of puce's muted tones.
  • Electric blue (#00F0FF) could disrupt the harmony with its intense vibrancy.
  • Hot pink (#FF69B4) shares a pinkish realm with puce but can dominate with its brightness, losing the nuanced elegance of puce.

The color puce carries a unique blend of symbolism due to its composition and historical use. Its brown component evokes stability, grounding, and a connection to nature. Its purple adds sophistication and a hint of mystery, potentially sparking intrigue.

However, the combination of brown and purple in puce can also suggest melancholy or lethargy. It's crucial in color psychology to balance these aspects, as puce can convey both calm and understated elegance or carry negative connotations.

In UI design, the nuanced mix of brown and purple makes puce both challenging and rewarding. Designers can harness its unique qualities to create intriguing and refined interfaces, but must carefully manage its use to avoid evoking negative feelings.

The origin of puce is unclear, but it likely first appeared in the 18th century. The French word "puce," meaning flea, describes the color of flea droppings or bloodstained bedding from flea bites. Initially, puce dye may have been made by crushing fleas and mixing the pigment with other colors to achieve a brownish-red shade. This method was later replaced by more modern pigment-making techniques.

Despite its strange and unpleasant beginnings, puce became popular in 18th-century France, especially during Louis XVI’s reign. Although there is no evidence that Marie Antoinette wore puce, it was favored by some aristocrats.

Color variations

Shades

Tints

Tones

Hues

Color Harmonies

Complementary

Split

Monochromatic

Analogous

Triadic

Square

Custom Palettes

Victorian Rose

Cactus Flower

Aphrodite

Large Text

Figma

Normal Text

How you design, align, and build matters. Do it together with Figma.

This is #E491A6 text on a #FFFFFF background.

2.36:1

WCAG 2.2 Simple Contrast

Normal Text

Fail
AA
4.5:1
Fail
AAA
7:1

Large Text

Fail
AA
3:1
Fail
AAA
4.5:1
Large Text

Figma

Normal Text

How you design, align, and build matters. Do it together with Figma.

This is #E491A6 text on a #000000 background.

8.9:1

WCAG 2.2 Simple Contrast

Normal Text

Pass
AA
4.5:1
Pass
AAA
7:1

Large Text

Pass
AA
3:1
Pass
AAA
4.5:1

Color simulations

Protanopia

Deuteranopia

Tritanopia

Achromatopsia

The hexadecimal color #E491A6, known as puce, has RGB values of R:228, G:145, B:166 and CMYK values of C:0, M:0.36, Y:0.27, K:0.11.

VALUECSS
HEXE491A6#E491A6
RGB DECIMAL228, 145, 166rgb(228,145,166)
RGB PERCENTAGE89.4, 56.9, 65.1rgb(89.4%,56.9%,65.1%)
CMYK0, 36, 27, 11
HSL344.8°, 60.6, 73.1hsl(344.8,60.6%,73.1%)
HSV (OR HSB)344.8°, 36.4, 89.4
WEB SAFECC9999#CC9999
CIE-LAB69.112, 34.063, 2.184
XYZ49.003, 39.501, 41.118
xyY0.378, 0.305, 39.501
CIE-LCH69.112, 34.133, 3.668
CIE-LUV69.112, 52.498, -3.182
HUNTER-LAB62.849, 29.188, 5.206
BINARY11100100, 10010001, 10100110
iOS - SwiftUIColor(red: 228/255, green: 145/255, blue: 166/255)
iOS - UIKitUIColor(red: 228/255.0, green: 145/255.0, blue: 166/255.0, alpha: 1.0)
Android - ComposeColor(0xFFE491A6)