What Colors Go with Very Dark Green? Color Pairing Examples to Give Near-Black Green a Deep, Rich Look [#17361F]

Very Dark Green (■#17361F) is a deep color that sits close to black while retaining a rich green cast. On a website, it works well in headers, hero sections, and footers when you want a weighty, natural presence, but relying only on dark greens can make boundaries between pieces of information harder to see. This article pairs ■#17361F with mist ivory, muted sage, and dusty terracotta to give the near-black green a deeper, richer look.

Pair it with mist ivory, muted sage, and dusty terracotta

One practical combination for ■#17361F is a light mist ivory ■#EEF3E8 with a slight green cast, a related muted sage ■#9FB28C, and a restrained dusty terracotta ■#D4A08D.

■#EEF3E8 creates a large brightness difference from the base color, making it useful for headings and body text on dark areas and as the background of light information surfaces. ■#9FB28C stays within the green family while adding lightness, so it works well for supporting text or thin separators. ■#D4A08D moves away from the base hue toward a low-saturation warm tone, so it can distinguish a primary button or small label without becoming as forceful as a vivid red or orange.

Giving the colors clear roles as a light information surface, a related middle tone, and a restrained warm accent helps preserve the depth of ■#17361F while preventing the page from becoming a continuous field of dark tones.

Use the deep green for structure and keep reading surfaces light

When ■#17361F is the base color, it is usually easier to use when the dark tone is concentrated in the header, hero section, or footer rather than spread across the entire page. Long passages and numeric information can then move onto a lighter surface.

A contrast ratio describes the difference in relative brightness between a foreground element and its background. The ratio is about 11.76:1 for ■#17361F with ■#EEF3E8, 5.82:1 for ■#17361F with ■#9FB28C, and 5.82:1 for ■#17361F with ■#D4A08D. Under WCAG 2.2, normal text needs at least 4.5:1 contrast. Visual information required to identify interface components or meaningful graphics needs at least 3:1 contrast against adjacent colors. The text pairs shown on the dark base meet the 4.5:1 threshold.

By contrast, ■#9FB28C on ■#EEF3E8 is about 2.02:1, and ■#D4A08D on ■#EEF3E8 is about 2.02:1. Neither should be used for normal body text on that light background; switch body text to a sufficiently dark color such as ■#17361F.

For a deeper look, limit the number of green tones and keep warm accents small

If you want ■#17361F to feel deep and substantial, it is generally easier to define clear roles for the light surface, supporting tone, and accent than to add many steps of similar dark green. Keep ■#9FB28C for supporting information or separators, while the main reading experience relies on the stronger light-dark difference between ■#EEF3E8 and ■#17361F.

Reserve ■#D4A08D for a primary action, thin line, or small label so it adds a little warmth to the green palette without taking over the page. If photography or product images already contain a lot of green or terracotta, avoid adding more supporting colors and increase the light ■#EEF3E8 area to reduce overall color density.

In HueRoll, you can enter ■#17361F as a HEX value. HEX is one way to represent a web color using a code that begins with #. You can explore related colors and palette suggestions and compare the selected color with white or black. HueRoll does not compare arbitrary color pairs or automatically determine WCAG conformance levels, so the pairwise contrast ratios in this article were calculated separately.