What Colors Go with Brilliant Indigo? Color Pairings That Give Vivid Blue-Violet a Striking, Cohesive Look [#7664F7]

Brilliant Indigo (■#7664F7) is a bright, vivid blue-violet built around blue with a noticeable violet cast. On an electronic-signature request screen, it can work well when it is limited to the selected contract, the primary “Send signature request” button, and a short accent on the signer currently being configured. This gives the vivid blue-violet a striking, cohesive role while keeping document names, recipients, and deadlines easy to organize. This example pairs it with Ice Gray, Ink Black, and Deep Amber.

Use Ice Gray as the base, then balance the blue-violet with near-black and amber

With ■#7664F7, one practical combination is Ice Gray ■#F7F8FC for document lists and signer cards, Ink Black ■#080B12 for document names, recipients, deadlines, and primary-button text, and Deep Amber ■#5A4632 for secondary actions such as viewing the audit trail or checking templates.

■#F7F8FC is a very light color with a slight blue cast, so it keeps document lists and signer settings feeling light. ■#080B12 is a near-black, low-saturation color that can organize document names, signer names, deadlines, and descriptions more quietly than the indigo. ■#5A4632 is a dark, muted yellow-red brown. Its hue—the basic color family such as red, blue, or green—is separated from blue-violet, so secondary actions such as “View audit trail” or “Check templates” can be distinguished from the primary send action.

On a signature-request screen, use Brilliant Indigo for the selected document and send action

For a practical layout, use ■#F7F8FC for document lists and unselected signer cards, then use ■#080B12 for document names, recipients, deadlines, and supporting descriptions. Their contrast ratio—a numerical measure of the relative brightness difference between foreground and background—is about 18.55:1.

Use ■#7664F7 for the selected contract card, the primary “Send signature request” button, and a short accent on the signer being configured, with ■#080B12 for text and icons. Their contrast ratio is about 4.63:1, above the 4.5:1 minimum for normal-size text. In addition, ■#7664F7 against ■#F7F8FC is about 4.01:1, so selected documents and the primary button also have more than a 3:1 difference from the light background.

For secondary buttons such as “View audit trail” or “Check templates,” use ■#5A4632 as the background with ■#FFFFFF text. Their contrast ratio is about 8.91:1. Deep Amber against the page background is about 8.40:1.

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

For a striking, cohesive look, do not rely on white text or color alone for signature states

■#7664F7 and ■#FFFFFF have a contrast ratio of about 4.25:1, so normal-size white text should not be placed on the indigo background. This example uses ■#080B12 for the primary-button text. Because ■#7664F7 against ■#080B12 is about 4.63:1 and does not have a large margin above the threshold, recalculate text contrast if the blue-violet is made lighter for hover or other states.

Also, ■#7664F7 and ■#5A4632 differ by only about 2.09:1, so do not use those two colors alone to communicate “not sent,” “sent,” “viewed,” “signed,” or “declined.” Pair color with status text, signer names, check marks, and deadline information. In HueRoll, you can enter ■#7664F7 as a HEX color code (a Web color code beginning with #), then review related colors, palette suggestions, and the selected color’s contrast against white and black. HueRoll does not compare arbitrary pairs of colors or automatically determine WCAG AA or AAA conformance, so the two-color contrast ratios in this article were calculated separately.