Back to palettes

Palette

Emerald Cityscape

Captures the vivid, luminous glow of a futuristic city where nature and neon collide.

VibrantEnergetic5 colors
More Vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Emerald Cityscape 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 Emerald Cityscape.

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

Data visualization

#0F1A2B#1B4F4F#4CAF50#8BC34A#B3E0A5

Palette guide

How to use Emerald Cityscape

Overview

The Emerald Cityscape palette captures the vivid, luminous glow of a futuristic city where nature and neon seamlessly intertwine. It features a deep, grounding #0F1A2B, a sophisticated teal #1B4F4F, and a duo of vibrant greens: #4CAF50 and #8BC34A. The light, airy #B3E0A5 completes the spectrum, offering versatility. This palette is exceptionally modern and energetic, ideal for technology brands, urban development projects, or digital interfaces that aim to convey innovation, growth, and a connection to nature within a contemporary context. Its balance of dark and bright hues allows for striking visual hierarchies.

Best used for

  • Tech startup branding and websites
  • Urban planning and architectural visualizations
  • Environmental tech or sustainability initiatives
  • Modern gaming interfaces and app design
  • Digital art with futuristic or utopian themes
  • Event branding for innovation conferences

Suggested color roles

primary

Use #0F1A2B for dominant backgrounds, navigation, or strong brand elements, providing a deep, stable foundation.

secondary

Employ #1B4F4F for subheadings, secondary graphics, or accents to add sophistication and depth.

accent

Apply #4CAF50 or #8BC34A for call-to-action buttons, interactive elements, or key highlights to introduce vibrancy.

background

Utilize #B3E0A5 for clean, light backgrounds that allow the darker and brighter greens to pop, or a crisp white.

text

For body text on light backgrounds, use #0F1A2B or a dark charcoal. For text on dark backgrounds, use #B3E0A5 or a bright white.

Accessibility notes

  • Ensure #0F1A2B or #1B4F4F text on #B3E0A5 provides sufficient WCAG contrast.
  • Avoid using #B3E0A5 for small text on light backgrounds; it's best for large headlines or accents.
  • The vibrant greens #4CAF50 and #8BC34A offer good contrast against #0F1A2B.
  • Consider using #0F1A2B with #4CAF50 for primary text and accent pairings for optimal readability.

Recommended combinations

Urban Depth

Ideal for creating a sophisticated, modern aesthetic in website headers, dark mode interfaces, or corporate branding.

#0F1A2B · #1B4F4F · #4CAF50

Vibrant Growth

Perfect for illustrating natural elements, data visualizations, or energetic UI components that need a fresh feel.

#4CAF50 · #8BC34A · #B3E0A5

Modern Contrast

Use for impactful call-to-action sections, hero images, or design elements that require a strong visual punch and clarity.

#0F1A2B · #B3E0A5 · #4CAF50

CSS variables

:root {
  --emerald-cityscape-1: #0F1A2B;
  --emerald-cityscape-2: #1B4F4F;
  --emerald-cityscape-3: #4CAF50;
  --emerald-cityscape-4: #8BC34A;
  --emerald-cityscape-5: #B3E0A5;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "emerald-cityscape": {
        1: "#0F1A2B",
        2: "#1B4F4F",
        3: "#4CAF50",
        4: "#8BC34A",
        5: "#B3E0A5",
      }
    }
  }
}

Related searches

emerald green cityscapefuturistic urban palettemodern green brandingtech nature color schemeenergetic city colors

Palette colors

Hex values

Color 1#0F1A2B
·
Color 2#1B4F4F
·
Color 3#4CAF50
·
Color 4#8BC34A
·
Color 5#B3E0A5
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.9:1Fail
6.3:1AA
8.3:1AAA
11.7:1AAA
2
1.9:1Fail
3.3:1AA18
4.4:1AA18
6.2:1AA
3
6.3:1AA
3.3:1AA18
1.3:1Fail
1.9:1Fail
4
8.3:1AAA
4.4:1AA18
1.3:1Fail
1.4:1Fail
5
11.7:1AAA
6.2:1AA
1.9:1Fail
1.4:1Fail

Similar palettes

More like Emerald Cityscape

View all Vibrant