What Colors Go with Soft Purple? Color Pairing Examples That Highlight Gentle Purple with an Elegant Look [#E5ABED]

Soft Purple (■#E5ABED) is a bright, gentle purple with a slight red cast. On a spa or relaxation-salon course-booking screen, it can work well when reserved for the selected treatment, the primary “Book this option” button, and a short accent on the treatment duration. This keeps the purple soft while supporting a more elegant, restrained composition. This example pairs it with Deep Plum, Warm Ivory, and Muted Sage.

Use Deep Plum to anchor the purple, then separate roles with ivory and sage

One practical palette for ■#E5ABED uses Deep Plum ■#342A3D for the booking-summary panel, Warm Ivory ■#FAF8F3 for treatment and date cards, and Muted Sage ■#4D665D for secondary actions such as viewing notes or cancellation terms.

■#342A3D is a dark, low-saturation purple that keeps Soft Purple gentle while giving text and outlines a firmer edge. ■#FAF8F3 is a very light warm color, helping treatment names, prices, durations, and booking times sit on a light surface without competing with the accent. ■#4D665D is a subdued green-gray. Its hue—the basic color family such as red, blue, or green—is separated from purple, helping “View notes” and “Check cancellation terms” stay distinct from the primary booking action.

On a booking screen, concentrate Soft Purple on the selected treatment and primary action

Use ■#FAF8F3 for treatment and date-card backgrounds, with ■#342A3D for treatment names, prices, durations, and supporting text. The contrast ratio—the numerical difference in relative brightness between foreground and background—is about 12.81:1 for this pair.

Set the booking-summary panel to ■#342A3D and use ■#E5ABED for the primary “Book this option” button, the selected treatment, and a short accent on the treatment duration. With ■#342A3D for the button text and icon, the contrast ratio is about 7.37:1, above the 4.5:1 minimum for normal-size text. The Soft Purple button surface against the Deep Plum panel is also about 7.37:1, helping the primary action stand out from the dark surface.

On a ■#FAF8F3 card, however, filling the selected treatment with ■#E5ABED produces only about 1.74:1 contrast between the two surfaces. Do not rely on the fill alone: add a ■#342A3D border, a “Selected” label, and a check icon. For secondary actions such as “View notes” or “Check cancellation terms,” use ■#4D665D as the button background with ■#FFFFFF text. That pair is about 6.22:1, and Muted Sage against Warm Ivory is about 5.86:1.

WCAG (Web Content Accessibility Guidelines) 2.2 requires at least 4.5:1 contrast for normal-size text. Visual information needed to identify meaningful UI (user interface) components or states should have at least 3:1 contrast against adjacent colors.

For an elegant look, avoid white text and color-only selection cues

■#E5ABED against ■#FFFFFF has a contrast ratio of about 1.85:1, so normal-size white text on the Soft Purple background does not reach the 4.5:1 minimum. In this example, the primary button therefore uses ■#342A3D for its text.

Also avoid distinguishing “Not selected,” “Selected,” “Booked,” and “Needs review” by color alone. Pair each state with a written label, date or time, and icons such as a check or warning symbol. Instead of spreading Soft Purple across a large background, keep it to selected states and the primary button while leaving more open space in ■#FAF8F3 for a calmer composition. In HueRoll, you can enter ■#E5ABED as a HEX code (a web color code beginning with #), review related colors and palette suggestions, and check the selected color against white and black. HueRoll does not compare arbitrary pairs of colors or automatically determine WCAG AA or AAA conformance, so the pairwise contrast ratios in this article were calculated separately.