What Colors Go with Brilliant Spring Green? Color Pairings That Make Vivid Fresh Green Look Lively [#76F764]

Brilliant Spring Green (■#76F764) is a bright, vivid fresh green with a noticeable yellow cast. In a budgeting screen for a household expense tracker, it can work well when reserved for the selected spending category, the monthly-budget progress bar, and the primary “Record expense” button. This keeps the fresh green lively while amounts, remaining budget, and input controls stay easy to organize. This example pairs it with Deep Slate, Mist White, and Deep Plum.

Use Deep Slate as the base, then separate the green with white and plum

One practical palette for ■#76F764 uses Deep Slate ■#1C2A32 for the budget summary and progress chart background, Mist White ■#F8FBF4 for category lists and form areas, and Deep Plum ■#65405D for secondary actions such as viewing history or opening budget settings.

■#1C2A32 is a dark, low-saturation color with a slight blue cast, creating a large lightness difference from the bright fresh green. ■#F8FBF4 is a very light yellow-green-tinted white that keeps category names, amounts, and input forms visually light. ■#65405D is a restrained dark red-violet. Its hue—the basic color family such as red, blue, or green—is farther from fresh green, helping distinguish secondary actions such as “View history” or “Budget settings” from the main recording action.

In a budgeting screen, concentrate Brilliant Spring Green on progress and the primary action

Use ■#1C2A32 for the budget summary and progress-chart background, with ■#F8FBF4 for the budget amount, spending total, remaining amount, and supporting text. The contrast ratio—the numerical difference in relative brightness between foreground and background—is about 14.09:1 for this pair.

Use ■#76F764 for the monthly-budget progress bar, the selected category, and the primary “Record expense” button. With ■#1C2A32 for the button text and icon, the contrast ratio is about 10.70:1, above the 4.5:1 minimum for normal-size text. The fresh-green progress bar against the Deep Slate background is also about 10.70:1, above the 3:1 minimum for meaningful graphical information.

For secondary actions such as “View history” or “Budget settings,” place ■#65405D buttons in a light ■#F8FBF4 area and use ■#FFFFFF for their text. White against Deep Plum is about 8.59:1, and Deep Plum against Mist White is about 8.22: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 graphical objects should have at least 3:1 contrast against adjacent colors.

For a lively look, avoid white text and color-only budget states

■#76F764 against ■#FFFFFF has a contrast ratio of only about 1.38:1, so normal-size white text should not be placed on the fresh-green background. In this example, the primary button uses ■#1C2A32 for its text.

Also avoid communicating states such as “Within budget,” “Nearly used,” or “Over budget” by color alone. Pair color with a written status label, amount, and icon. On the light ■#F8FBF4 background, ■#76F764 has only about 1.32:1 contrast, so do not rely on a thin fresh-green border or pale strip alone to indicate selection. In HueRoll, you can enter ■#76F764 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.