Back to palettes

Palette

Emerald City Glaze

Sparkling greens and teal blues evoke the fantastical, glistening hues of an emerald city at dawn.

vibrantelegant5 colors
More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#0F3837#215F5E#3D8785#6DC2C0#9AD9D7

Palette guide

How to use Emerald City Glaze

Overview

The Emerald City Glaze palette (ID: emerald-city-glaze) offers a captivating spectrum of deep to light emerald and teal hues, reminiscent of a glistening, fantastical city at dawn. With the profound #0F3837, the rich #215F5E, and the vibrant #3D8785, it transitions beautifully to the brighter #6DC2C0 and the ethereal #9AD9D7. This gradient-rich palette is perfect for creating designs that evoke mystery, sophistication, and a touch of magic. It's highly effective for digital interfaces, branding, and visual content that aims to be both elegant and visually dynamic, providing depth and luminosity.

Best used for

  • Fantasy-themed branding and game UI
  • Elegant website and app design
  • Luxury product packaging
  • Digital art and illustration with shimmering effects
  • Event decor for sophisticated gatherings
  • Editorial layouts for high-end lifestyle magazines

Suggested color roles

primary

Use #0F3837 for foundational elements, headers, or backgrounds that require a deep, grounding presence.

secondary

Employ #215F5E or #3D8785 for subheadings, navigation, or larger graphical components to build visual interest.

accent

Apply #9AD9D7 for subtle highlights, interactive elements, or delicate patterns that need a luminous touch.

background

While a light background like #F0F8FF can work, consider using a gradient from #0F3837 to #215F5E for a rich, immersive feel.

text

For body text, a dark charcoal like #222222 or the deep #0F3837. Use white or #9AD9D7 for text on darker shades.

Accessibility notes

  • Ensure sufficient contrast for text when using #0F3837 or #215F5E on lighter backgrounds or vice-versa.
  • Text in #9AD9D7 will require a very dark background for readability; avoid on light backgrounds.
  • The transition from #6DC2C0 to #9AD9D7 might have low contrast for certain elements; use with care.
  • For accessible gradients, ensure text overlays maintain good contrast at all points of the gradient.

Recommended combinations

Deep Mystique

Ideal for creating a sense of depth and luxury in headers, backgrounds, or sophisticated graphical elements.

#0F3837 · #215F5E · #3D8785

Glistening Dawn

Perfect for gradients, illustrations, or UI elements that need to convey lightness, shimmer, and ethereal qualities.

#3D8785 · #6DC2C0 · #9AD9D7

Dynamic Contrast

Use for impactful branding where the dark base is contrasted with a bright highlight to create visual tension and elegance.

#0F3837 · #9AD9D7 · #215F5E

CSS variables

:root {
  --emerald-city-glaze-1: #0F3837;
  --emerald-city-glaze-2: #215F5E;
  --emerald-city-glaze-3: #3D8785;
  --emerald-city-glaze-4: #6DC2C0;
  --emerald-city-glaze-5: #9AD9D7;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "emerald-city-glaze": {
        1: "#0F3837",
        2: "#215F5E",
        3: "#3D8785",
        4: "#6DC2C0",
        5: "#9AD9D7",
      }
    }
  }
}

Related searches

emerald teal color gradientshimmering green palettefantasy city colorselegant jewel tone palettevibrant green web design

Palette colors

Hex values

Color 1#0F3837
·
Color 2#215F5E
·
Color 3#3D8785
·
Color 4#6DC2C0
·
Color 5#9AD9D7
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.7:1Fail
3:1AA18
6.2:1AA
8.1:1AAA
2
1.7:1Fail
1.7:1Fail
3.5:1AA18
4.6:1AA
3
3:1AA18
1.7:1Fail
2:1Fail
2.7:1Fail
4
6.2:1AA
3.5:1AA18
2:1Fail
1.3:1Fail
5
8.1:1AAA
4.6:1AA
2.7:1Fail
1.3:1Fail

Similar palettes

More like Emerald City Glaze

View all vibrant
Regal Emerald Bloom
Art Deco Emerald Pool
Emerald City Gleam
Emerald Gemstone Luster
Gatsby Green Glam
Opulent Jade Bloom