Back to palettes

Palette

Concrete Jungle Bloom

A modern fusion of concrete grays and surprising teal-blues, representing nature's resilience in the urban landscape.

coolelegant5 colors
More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Concrete Jungle Bloom 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 Concrete Jungle Bloom.

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

Data visualization

#778899#A9A9A9#36454F#5F9EA0#ADD8E6

Palette guide

How to use Concrete Jungle Bloom

Overview

The "Concrete Jungle Bloom" palette masterfully fuses robust concrete grays with refreshing teal-blues, symbolizing nature's resilience amidst urban landscapes. Anchored by a deep charcoal like #36454F and versatile grays such as #778899 and #A9A9A9, it introduces vibrant yet sophisticated blues like #5F9EA0 and the light, airy #ADD8E6. This collection is perfect for designers seeking to convey a modern, elegant, and subtly optimistic aesthetic. It offers a unique balance between industrial strength and natural serenity, ideal for projects that bridge urban sophistication with a breath of fresh air.

Best used for

  • Modern tech company branding
  • Urban development project websites
  • Eco-conscious product lines
  • Contemporary art gallery interfaces
  • Architectural visualization
  • Travel blogs focused on city exploration

Suggested color roles

primary

#778899 - A sturdy, cool grey that provides a sophisticated and reliable foundation for main content and brand identity.

secondary

#A9A9A9 - A versatile, lighter grey, excellent for supporting text, subtle backgrounds, or secondary UI elements, offering a clean look.

accent

#5F9EA0 - A striking teal-blue that brings a vibrant, modern "bloom" to the palette, perfect for calls to action, interactive elements, or key highlights.

background

#ADD8E6 - A very light, airy blue that creates a refreshing and open backdrop, enhancing readability and a sense of calm.

text

#36454F - A deep, rich charcoal that ensures optimal contrast and readability for all body text, especially on lighter backgrounds.

Accessibility notes

  • Ensure #36454F text on #ADD8E6 or #A9A9A9 backgrounds meets WCAG AA standards.
  • The #5F9EA0 accent color should have sufficient contrast when used for text or interactive elements on backgrounds like #778899 or #A9A9A9.
  • Avoid using #ADD8E6 for small text on #A9A9A9 as contrast will be low.
  • When using #5F9EA0 for icons, ensure a clear visual distinction from surrounding elements.

Recommended combinations

Urban Oasis

Creates a deep, grounding effect with a refreshing pop of color, suitable for headers or hero sections.

#36454F · #778899 · #5F9EA0

Soft Bloom

Delivers a light, airy feel for content blocks or serene backgrounds, maintaining readability.

#A9A9A9 · #ADD8E6 · #778899

Dynamic Contrast

Emphasizes key features with a vibrant blue against dark and light neutrals, ideal for calls to action.

#5F9EA0 · #36454F · #ADD8E6

CSS variables

:root {
  --concrete-jungle-bloom-2-1: #778899;
  --concrete-jungle-bloom-2-2: #A9A9A9;
  --concrete-jungle-bloom-2-3: #36454F;
  --concrete-jungle-bloom-2-4: #5F9EA0;
  --concrete-jungle-bloom-2-5: #ADD8E6;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "concrete-jungle-bloom-2": {
        1: "#778899",
        2: "#A9A9A9",
        3: "#36454F",
        4: "#5F9EA0",
        5: "#ADD8E6",
      }
    }
  }
}

Related searches

concrete blue color paletteurban teal grey designmodern sophisticated colorsnature in city paletteelegant grey blue scheme

Palette colors

Hex values

Color 1#778899
·
Color 2#A9A9A9
·
Color 3#36454F
·
Color 4#5F9EA0
·
Color 5#ADD8E6
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.5:1Fail
2.7:1Fail
1.2:1Fail
2.4:1Fail
2
1.5:1Fail
4.2:1AA18
1.3:1Fail
1.5:1Fail
3
2.7:1Fail
4.2:1AA18
3.2:1AA18
6.5:1AA
4
1.2:1Fail
1.3:1Fail
3.2:1AA18
2:1Fail
5
2.4:1Fail
1.5:1Fail
6.5:1AA
2:1Fail

Similar palettes

More like Concrete Jungle Bloom

View all cool
Midnight Urban Gleam
Urban Teal Twilight
Art Deco Elegance
Art Deco Metropolis
Cityscape Nocturne Blue
Cityscape Twilight Azure