Forest Green Hex Code: #228B22

#228B22 is the forest green hex code most people need first. If you searched for forest green hex code, forest green color code, or forest green colour code, you want a number you can paste into CSS, Figma, or a style guide. This page gives the most common web values, explains why they differ, and shows a full forest green color palette and forest green color scheme starting points. We also list Ocean Breeze color hex codes for the blue–green palette many teams pair with natural greens.

Forest green hex code (the usual answers)

The closest thing to a single canonical forest green hex on the web is the CSS named color forestgreen, which is #228B22 — rgb(34, 139, 34). That is the value browsers resolve when you write color: forestgreen;. Not sure what to call a hex from a screenshot? Use our color name finder to match it to the nearest named color.

In product and UI design, color forest green often means something darker and more evergreen. A widely used deep green is #065F46 (rgb(6, 95, 70)), which anchors the five-step forest palette we use across Theme & Color. Another deep option you may see in branding is #2D5016 (rgb(45, 80, 22)).

CSS named: #228B22·Deep UI green: #065F46·Dark forest: #2D5016

Forest green colour code (UK) and RGB

British English searches for forest green colour code still expect hex on screen—the format does not change by region. What changes is spelling in copy (colour vs color). For accessibility documentation, list hex, RGB, and HSL so developers anywhere can implement the same appearance.

• #228B22 → RGB rgb(34, 139, 34)
• #065F46 → RGB rgb(6, 95, 70)

Forest green color palette (five hex codes)

A practical forest green color palette needs more than one swatch: dark tones for navigation and type on light UI, mid greens for primary buttons and links, and a minty light green for backgrounds or success. The set below matches our Forest Green palette story so you can jump between the quick codes here and the longer brand-and-UI guide.

#065F46·#047857·#059669·#10B981·#34D399

To extend this range (hover, disabled, dark mode), use the palette generator starting from any of these hex values.

If you are planning physical-media palettes or art-style blends, test combinations in our Color Mixing Simulator to see how forest tones shift in an RYB paint model.

Forest green color scheme ideas

A forest green color scheme is how you combine forest greens with neutrals and accents. Reliable patterns:

• Forest green + warm off-white — Use #FAFAF9 or cream with #065F46 text or headers for editorial, wellness, and eco brands.
• Forest green + charcoal — #111827 body text with #059669 buttons keeps contrast strong on white (always verify with a checker).
• Forest green + brass gold — Muted gold (#B45309 or softer metallics) with deep green reads premium without defaulting to black and gold.

Before shipping, run your text, links, and CTA pairs through the contrast checker so your forest green scheme stays WCAG-aligned.

Ocean Breeze color and Ocean Breeze colour hex codes

Teams looking up Ocean Breeze color or Ocean Breeze colour usually want the full blue-to-mint ramp in one line. Here are the five hex codes; the deep dive (roles, CSS variables, accessibility) lives in the Ocean Breeze palette guide.

#0EA5E9·#06B6D4·#14B8A6·#10B981·#34D399

Ocean Breeze shares two greens with the forest palette (#10B981, #34D399), so you can bridge a calm blue UI into natural green accents without inventing new tokens.

HSL, CMYK, and design-token formats

Beyond the forest green hex code, teams document the same appearance in HSL and CMYK so print vendors and CSS authors stay aligned. For #228B22, HSL is approximately hsl(120, 61%, 34%)—a yellow-green hue at moderate saturation and mid-low lightness. That HSL profile explains why forest green feels “wooded” rather than neon: it is not fully saturated like pure green (#00FF00), and it is not washed out like a mint tint.

CMYK approximations for coated stock often land near C76 M12 Y100 K20, but paper, ink, and dot gain shift results. Always request a physical proof when packaging must match a screen token. In Figma or design tokens, store hex as the source of truth and derive RGB/HSL programmatically so refactors do not drift.

If your stack uses OKLCH or LCH for perceptual uniformity, convert from #228B22 once, then build lighter tints and darker shades as consistent steps rather than hand-picking random greens. That discipline keeps hover, focus, and disabled states visually related on dashboards and marketing sites.

Forest green vs hunter green vs emerald

Searchers often conflate names. Forest green (#228B22) is the CSS named color—medium-dark and clearly green on white. Hunter green (#355E3B) is cooler and deeper, common in outerwear and heritage logos. Emerald UI greens such as #059669 are brighter and more digital-native, popular in fintech and SaaS success states.

When you write a style guide, define which name maps to which hex. Saying “use forest green” without a number invites developers to pick #228B22, #065F46, or #006400 interchangeably. Competitor pages that only list one swatch lose trust; this guide lists ten related stops in the table above so art directors can brief backgrounds, borders, and CTAs separately.

For outdoor and sustainability brands, pair canonical forest with photographic greens in hero imagery, then lock UI chrome to tokenized hex values. Users forgive natural variation in photos; they do not forgive inconsistent button greens across checkout steps.

Forest green in UI and accessibility

Forest green works for navigation bars, success toasts, and eco badges when contrast is verified. White text on #228B22 often passes WCAG AA for large bold headings but may fail for small body copy—always test your exact font weight and size. On light backgrounds, use deep greens like #065F46 for text and links instead of the mid-tone forest swatch, which can look muddy at 14px.

Dark mode needs separate tokens: a forest header that feels rich on white can glow too brightly on #111827. Desaturate or darken accent greens by 10–15% for dark surfaces, and re-run contrast for every state (hover, focus, disabled). The contrast checker catches failures before launch.

Color-blind users distinguish forest from red-orange more reliably than pure red vs green, but never rely on hue alone for errors—pair color with icons and text. For data visualization, use forest as one series color among blues and ambers so charts remain readable in deuteranopia simulations.

Forest green in branding and print

National parks, garden centers, organic food, and outdoor apparel gravitate toward forest greens because the hue signals growth, stability, and the natural world without the clinical feel of hospital teal. When the forest green color code anchors a logo, keep secondary colors restrained—warm off-white, charcoal, or muted gold—so the mark does not compete with photography.

UK teams searching forest green colour code should still specify hex in digital handoffs; CMYK and Pantone references belong in print appendices. If you must match Pantone 349 C or similar, note the delta from #228B22 on screen so stakeholders expect a slight shift on cartons and signage.

Merchandise and uniforms sometimes need dye lots darker than web forest. Document a “print forest” token (#1A4D1A or hunter-adjacent) alongside the web canonical so brand police do not reject legitimate manufacturing variance.

Also searched for

What is the forest green color code?

The standard forest green color code for web and CSS is hex #228B22. British English searches for forest green colour code use the same hex value—only spelling in copy changes, not the digits you paste into Figma or stylesheets.

What is the RGB value of forest green?

For #228B22, the RGB value of forest green is RGB(34, 139, 34). Deep UI greens such as #065F46 use RGB(6, 95, 70) when you need darker navigation or button fills.

What colors make forest green?

In traditional paint mixing (RYB), forest green is approximated by combining blue and yellow in roughly a 1:2 ratio—more yellow than blue—then adjusting with black or white for depth. On screen, you rarely mix channels manually; use #228B22 or test blends in our Color Mixing Simulator.

Is forest green dark or light?

Forest green is medium-dark: darker than lime or spring green, but not as near-black as hunter or bottle green. At roughly 34% HSL lightness, #228B22 reads as rich foliage rather than a pastel tint—use lighter rows in the shade table above for backgrounds.

Related colors

• Sage Green Hex Code — muted gray-green for wellness and lifestyle UI
• Navy Blue Hex Code — deep blue anchor for trust-heavy layouts
• Terracotta Hex Code — warm clay accent that pairs with natural greens
• Ocean Breeze Hex Codes — blue-to-mint ramp that bridges cool UI into green accents

Where to go next

• Forest Green: meaning, psychology, and best uses
• Ocean Breeze: full palette and accessibility notes
• Generate harmonies from any forest green hex
• Mix forest green with accent colors in the Color Mixing Simulator