Palette

Jade Vineyard Vines

Lush greens, from deep to vibrant, portray healthy jade-colored vines thriving in a sunny vineyard.

earthnatural5 colors

More earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Jade Vineyard Vines 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 Jade Vineyard Vines.

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

Data visualization

#3B6E4A#6FA57C#A5D2B3#2A523A#1F3D2A

Palette guide

How to use Jade Vineyard Vines

Overview

The Jade Vineyard Vines palette is a collection of lush, natural greens designed to evoke the serene beauty of thriving botanical landscapes. Featuring five harmonious shades, from the deep, grounding #1F3D2A to the vibrant mid-tone #3B6E4A and the airy #A5D2B3, this palette offers designers and developers a versatile range for creating rich, organic aesthetics. It's perfect for projects aiming for an elegant, earthy feel, providing depth and freshness without being overly bright. Use #2A523A for strong foundational elements and #6FA57C for a refreshing lift, ensuring a sophisticated yet approachable visual experience across digital and print mediums.

Best used for

Eco-friendly brand identities and websites
Luxury organic product packaging
Botanical garden or nature-themed app designs
Interior design visualization for natural spaces
Sustainable fashion lookbooks
Health and wellness industry marketing materials

Suggested color roles

primary

#3B6E4A - A balanced, natural green ideal for main brand elements, large sections, or primary calls to action, conveying growth and stability.

secondary

#6FA57C - A softer, more inviting green that pairs beautifully with the primary, suitable for secondary buttons, illustrations, or informational panels.

accent

#A5D2B3 - A light, airy shade perfect for subtle highlights, interactive states, or delicate graphic elements to add a touch of freshness.

background

#1F3D2A - A deep, sophisticated background color for dark mode interfaces or to make lighter elements pop, providing a luxurious, earthy foundation.

text

For dark backgrounds like #1F3D2A or #2A523A, use a light text color like white or near-white. For lighter backgrounds such as #A5D2B3 or #6FA57C, use a dark green like #1F3D2A or #2A523A for optimal readability.

Accessibility notes

Ensure sufficient contrast when using #A5D2B3 for text, especially against other light greens like #6FA57C; aim for darker text.
Pair the deepest greens, #1F3D2A or #2A523A, with lighter shades like #A5D2B3 or white for high-contrast text and UI elements.
Avoid using #6FA57C as text on #3B6E4A as their contrast ratio might be insufficient for accessibility standards.
Consider a very dark text color, like #1F3D2A, on lighter backgrounds such as white or #A5D2B3 for body copy readability.

Recommended combinations

Deep Forest

Ideal for a sophisticated, nature-inspired hero section or a dark-themed UI, with #A5D2B3 for accents or light text.

#1F3D2A · #3B6E4A · #A5D2B3

Fresh Growth

Suitable for branding that needs a blend of richness and approachability; use #2A523A for strong headings against #6FA57C.

#3B6E4A · #6FA57C · #2A523A

Vineyard Twilight

Creates a balanced look with a solid dark base, a light accent, and a mid-tone for secondary elements, perfect for elegant data visualization.

#2A523A · #A5D2B3 · #6FA57C

CSS variables

:root {
  --jade-vineyard-vines-1: #3B6E4A;
  --jade-vineyard-vines-2: #6FA57C;
  --jade-vineyard-vines-3: #A5D2B3;
  --jade-vineyard-vines-4: #2A523A;
  --jade-vineyard-vines-5: #1F3D2A;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "jade-vineyard-vines": {
        1: "#3B6E4A",
        2: "#6FA57C",
        3: "#A5D2B3",
        4: "#2A523A",
        5: "#1F3D2A",
      }
    }
  }
}

Hex values

Color 1#3B6E4A

Color 2#6FA57C

Color 3#A5D2B3

Color 4#2A523A

Color 5#1F3D2A

Accessibility

Contrast checker

2.1:1Fail

3.5:1AA18

1.5:1Fail

2:1Fail

2.1:1Fail

1.7:1Fail

3.1:1AA18

4.2:1AA18

3.5:1AA18

1.7:1Fail

5.3:1AA

7.1:1AAA

1.5:1Fail

3.1:1AA18

5.3:1AA

1.3:1Fail

2:1Fail

4.2:1AA18

7.1:1AAA

1.3:1Fail

Similar palettes

More like Jade Vineyard Vines

View all earth

Botanical Sketch Green

Desert Succulent Path

Lush Botanical Garden

Mossy Glade Retreat

Rainforest Fern

Succulent Garden Dew