Back to palettes

Palette

Urban Jungle Canopy

Blends the starkness of urban structures with unexpected pockets of vibrant, resilient nature.

darknatural5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Urban Jungle Canopy 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 Urban Jungle Canopy.

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

Data visualization

#525B5C#7A8686#2E4B4F#8FBF6A#446C49

Palette guide

How to use Urban Jungle Canopy

Overview

The Urban Jungle Canopy palette masterfully blends the stark, cool tones of urban architecture with the vibrant resilience of nature. Featuring deep, sophisticated greens like #2E4B4F and #446C49, alongside versatile grays such as #525B5C and #7A8686, it offers a grounding yet refreshing aesthetic. The bright, hopeful accent of #8FBF6A provides a crucial visual lift, simulating pockets of thriving greenery amidst concrete. Ideal for designs seeking a modern, natural, and balanced feel, this palette encourages a sophisticated interplay between organic and industrial elements. Developers will appreciate its clear hierarchy potential.

Best used for

  • Architectural visualization and renders
  • Modern corporate and tech branding
  • Sustainable product packaging
  • Urban landscape design concepts
  • Nature-inspired editorial layouts
  • Sophisticated web and app interfaces

Suggested color roles

primary

Use #2E4B4F as a deep, sophisticated primary for large background areas, strong headers, or foundational UI elements.

secondary

Apply #525B5C as a dark charcoal gray for supporting content, sidebars, or secondary navigation.

accent

Deploy #8FBF6A as a bright, fresh green for calls-to-action, interactive elements, or vibrant graphic highlights.

background

Utilize #7A8686 as a muted mid-gray background, providing a calm canvas that allows the greens to pop effectively.

text

For dark backgrounds, use white or a light gray. For light backgrounds, use a very dark gray like #2E4B4F or #525B5C.

Accessibility notes

  • Ensure sufficient contrast when using #7A8686 as a background with lighter text. Prioritize dark text on this color.
  • The vibrant #8FBF6A will need a very dark background (e.g., #2E4B4F or #525B5C) for optimal legibility and contrast.
  • Avoid using #525B5C and #7A8686 for adjacent text and background without careful WCAG contrast checking.
  • Always verify text legibility, especially with the subtle green tones, to ensure readability for all users.

Recommended combinations

Urban Base

Creates a sophisticated, deep, and modern urban backdrop for main sections.

#525B5C · #7A8686 · #2E4B4F

Nature's Glimmer

A muted base with a vibrant natural highlight for fresh details and accents.

#7A8686 · #8FBF6A · #446C49

Deep Contrast

Strong dark green, bright accent, and a solid charcoal for impactful elements and clear hierarchy.

#2E4B4F · #8FBF6A · #525B5C

CSS variables

:root {
  --urban-jungle-canopy-1: #525B5C;
  --urban-jungle-canopy-2: #7A8686;
  --urban-jungle-canopy-3: #2E4B4F;
  --urban-jungle-canopy-4: #8FBF6A;
  --urban-jungle-canopy-5: #446C49;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "urban-jungle-canopy": {
        1: "#525B5C",
        2: "#7A8686",
        3: "#2E4B4F",
        4: "#8FBF6A",
        5: "#446C49",
      }
    }
  }
}

Related searches

modern green grey palettearchitectural color schemeurban nature aestheticsustainable design colorsdeep forest city hues

Palette colors

Hex values

Color 1#525B5C
·
Color 2#7A8686
·
Color 3#2E4B4F
·
Color 4#8FBF6A
·
Color 5#446C49
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.9:1Fail
1.3:1Fail
3.3:1AA18
1.2:1Fail
2
1.9:1Fail
2.5:1Fail
1.8:1Fail
1.6:1Fail
3
1.3:1Fail
2.5:1Fail
4.4:1AA18
1.6:1Fail
4
3.3:1AA18
1.8:1Fail
4.4:1AA18
2.8:1Fail
5
1.2:1Fail
1.6:1Fail
1.6:1Fail
2.8:1Fail

Similar palettes

More like Urban Jungle Canopy

View all dark
Ancient Canopy Soul
Ancient Grove Hues
Ancient Wood Realm
Conifer Shadow
Deep Forest Seclusion
Deep Wood Ferns