Palette

Botanical Leaf Veins

A diverse range of greens inspired by the intricate patterns and varying shades of botanical leaf veins.

earthnatural5 colors

More earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Botanical Leaf Veins reads on buttons, badges, and alerts before you commit.

This alert border and accent use the palette's detail color.

Marketing banner

Launch

Built with Botanical Leaf Veins.

A bolder treatment that stretches the primary and secondary colors across a full gradient banner.

Data visualization

#228B22#32CD32#6B8E23#556B2F#006400

Palette guide

How to use Botanical Leaf Veins

Overview

The Botanical Leaf Veins palette showcases a diverse range of greens, reflecting the intricate beauty and varying shades found in nature. From the deep, grounding #006400 to the vibrant #32CD32, and including the earthy #556B2F, this collection offers designers a rich tapestry of organic tones. The classic #228B22 and versatile #6B8E23 complete the set, allowing for sophisticated natural designs. This palette is ideal for projects that aim to evoke growth, vitality, and the subtle complexity of the natural world, such as environmental reports, health and wellness platforms, or any brand seeking an authentic and refreshing connection to nature. Its cohesive green spectrum ensures visual harmony.

Best used for

Environmental science websites and infographics
Health and wellness product branding
Sustainable architecture presentations
Educational content on botany and biology
Outdoor adventure gear marketing
Natural skincare and cosmetics packaging

Suggested color roles

primary

Establish #228B22 as the core brand color, providing a strong yet approachable natural green for main headings and elements.

secondary

Use #6B8E23 for supporting content, sub-sections, or as a complementary background element, offering a softer, earthy tone.

accent

Apply the vibrant #32CD32 to highlight calls-to-action, key data points, or interactive features that demand immediate attention.

background

Employ a very light green or near-white background to make the rich greens of the palette truly pop, ensuring clarity.

text

The deep #006400 is excellent for body text and critical information, providing strong contrast and readability on light backgrounds.

Accessibility notes

Ensure text set in #006400 has sufficient contrast against light backgrounds to meet WCAG AA standards for readability.
Check the contrast of #32CD32 when used for interactive elements on different background colors to ensure visibility.
Avoid pairing #556B2F with #6B8E23 for text and background without careful contrast testing due to their similar values.
For charts or graphs, use distinct patterns or labels in addition to color to convey information for color vision impaired users.

Recommended combinations

Vibrant Growth

Creates a dynamic, high-contrast look perfect for conveying energy and growth in headers or feature sections.

#32CD32 · #006400 · #228B22

Earthy Depth

Offers a rich, grounded feel, ideal for showcasing natural materials or providing a stable backdrop for content.

#556B2F · #6B8E23 · #228B22

Leafy Accent

Combines the deepest green with the brightest accent and a mid-tone, suitable for striking logos or emphasized calls-to-action.

#006400 · #32CD32 · #6B8E23

CSS variables

:root {
  --botanical-leaf-veins-1: #228B22;
  --botanical-leaf-veins-2: #32CD32;
  --botanical-leaf-veins-3: #6B8E23;
  --botanical-leaf-veins-4: #556B2F;
  --botanical-leaf-veins-5: #006400;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "botanical-leaf-veins": {
        1: "#228B22",
        2: "#32CD32",
        3: "#6B8E23",
        4: "#556B2F",
        5: "#006400",
      }
    }
  }
}

Hex values

Color 1#228B22

Color 2#32CD32

Color 3#6B8E23

Color 4#556B2F

Color 5#006400

Accessibility

Contrast checker

2.1:1Fail

1.2:1Fail

1.4:1Fail

1.7:1Fail

2.1:1Fail

1.8:1Fail

2.8:1Fail

3.5:1AA18

1.2:1Fail

1.8:1Fail

1.6:1Fail

2:1Fail

1.4:1Fail

2.8:1Fail

1.6:1Fail

1.3:1Fail

1.7:1Fail

3.5:1AA18

2:1Fail

1.3:1Fail

Similar palettes

More like Botanical Leaf Veins

View all earth

Botanical Bloom Line

Botanical Sketch

Botanical Study Greens

Enchanted Forest Bloom

Enchanted Forest Lumina

Forest Bark Comfort