What Colors Go with Bordeaux? Color Pairings That Bring Out Its Depth

The color name Bordeaux can cover a range of shades. In this article, a deep red-purple ■#6E1E36 is used as one practical reference. It can give headings, buttons, and short bands a strong presence even in a small area, but surrounding it with too many other dark colors can make the whole screen feel heavy. The combinations below keep the depth of Bordeaux while giving it enough space to stand out.

Pair Bordeaux with light neutrals and low-saturation colors to bring out its depth

A dark red-purple such as ■#6E1E36 becomes easier to distinguish when there is a clear difference in lightness around it. Use a light ivory or pale green for the background, then give Bordeaux a focused role in headings, primary buttons, or short labels. This lets the deep color act as the visual anchor without covering the entire interface.

It also helps to pair Bordeaux with colors of restrained saturation, meaning lower color intensity. When you introduce a different hue—the basic color family such as red, yellow, green, or blue—keeping that second color pale and muted reduces competition between the two.

Three color pairings that make use of Bordeaux’s depth

1. Create bright breathing room with ivory

Use ■#FAF6F1 for the background, ■#2D2628 for body text, and ■#6E1E36 for headings or primary buttons. The contrast ratio, a measure of the relative brightness difference between foreground and background colors, is about 13.75:1 for the body text on the background and about 10.26:1 for Bordeaux on the background. Leaving a large light area means you do not need much Bordeaux to make its depth noticeable. This works well on content-heavy screens such as corporate sites and article pages.

2. Use sage green to create hue separation

For a secondary section, use pale sage ■#D8E0D2 as the background, deep green ■#243028 for body text, and Bordeaux ■#6E1E36 as the accent. The body text and background are about 10.15:1, while Bordeaux against the background is about 8.16:1. Red-purple and green sit far apart in hue, so they are easy to distinguish, while the muted sage keeps the two colors from competing too strongly.

3. Use Bordeaux as the background with light text

For a hero area—the prominent visual section near the top of a page—or a short band, use ■#6E1E36 as the background and ivory ■#FAF6F1 for text. Their contrast ratio is about 10.26:1. A restrained gold such as ■#C5A46D can be added in a small amount for a change in brightness and hue. Instead of using the gold broadly as body text, keep it to small decorative lines or similar supporting details so the Bordeaux remains the dominant deep color.

Adjust the area covered by Bordeaux and choose text colors carefully

When Bordeaux is used as a background, white ■#FFFFFF against Bordeaux ■#6E1E36 has a contrast ratio of about 11.04:1. This exceeds the 4.5:1 minimum that WCAG (Web Content Accessibility Guidelines) 2.2 requires for normal-size text. Black ■#000000 against Bordeaux ■#6E1E36, by comparison, is about 1.90:1 and is not suitable for normal text.

Deep colors tend to influence the overall appearance more strongly as their area increases. Rather than covering an entire page with Bordeaux, use it for headings and buttons within a light layout, or keep dark sections short and separated by lighter areas. Deciding the amount of the color before adding more accents makes the palette easier to control.

In HueRoll, you can enter ■#6E1E36 as a six-digit HEX code, a hexadecimal format used to represent Web colors, and review tints, shades, complementary colors, analogous colors, other palette suggestions, and contrast against white or black. HueRoll does not compare arbitrary color pairs or automatically determine WCAG AA or AAA conformance, so the pairwise contrast ratios in this article were calculated separately.