Back to palettes

Palette

Enchanted Garden Pond

Deep, cool greens and blues evoking the hidden tranquility and mystical allure of a shaded garden pond.

DarkCalm5 colors
More Dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Enchanted Garden Pond 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 Enchanted Garden Pond.

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

Data visualization

#0C2C32#274D4F#426E6C#5E8F89#79B0A6

Palette guide

How to use Enchanted Garden Pond

Overview

The Enchanted Garden Pond palette evokes the hidden tranquility and mystical allure of a shaded garden pond with its deep, cool greens and blues. Ranging from the profound #0C2C32 to the shimmering #79B0A6, including a balanced #426E6C, this collection is tranquil and immersive. It's an excellent choice for designers and developers crafting dark mode UI, luxury spa branding, or aquatic themes. The cool, watery tones create an atmosphere of peace, natural beauty, and subtle magic, perfect for projects seeking a serene and sophisticated visual experience.

Best used for

  • Dark mode user interfaces
  • Luxury spa and wellness branding
  • Aquatic and water-themed designs
  • Sophisticated digital art
  • Meditation and mindfulness apps
  • Nature-inspired jewelry design

Suggested color roles

primary

Use #0C2C32 as a deep, mysterious primary color for backgrounds, headers, or dominant content blocks in dark mode.

secondary

Apply #274D4F for rich, supportive cool blue-green elements, providing depth and continuity.

accent

Introduce #5E8F89 as a shimmering, tranquil highlight for interactive elements, subtle details, or calls-to-action.

background

Utilize #79B0A6 for light, watery backdrops, or #0C2C32 for a deep, immersive dark theme.

text

White or a very light grey offers excellent contrast on #0C2C32, #274D4F, and #426E6C. Use #0C2C32 for text on #79B0A6.

Accessibility notes

  • White text on #0C2C32 provides optimal contrast for readability in dark themes.
  • Ensure sufficient contrast when using #5E8F89 for text on #79B0A6; aim for larger font sizes if used.
  • Avoid using dark text on any color darker than #5E8F89 to maintain readability.
  • The palette is well-suited for dark themes; consistently use light text for best accessibility.

Recommended combinations

Pond Depths

A powerful combination for primary layouts, balancing deep tones with a tranquil, shimmering accent.

#0C2C32 · #274D4F · #5E8F89

Watery Reflections

Create layered backgrounds or content blocks, evoking the clear, reflective surface of a pond.

#79B0A6 · #426E6C · #274D4F

Tranquil Contrast

Employ for strong visual hierarchy, using the darkest and lightest hues for clear foreground/background separation.

#0C2C32 · #79B0A6 · #426E6C

CSS variables

:root {
  --enchanted-garden-pond-1: #0C2C32;
  --enchanted-garden-pond-2: #274D4F;
  --enchanted-garden-pond-3: #426E6C;
  --enchanted-garden-pond-4: #5E8F89;
  --enchanted-garden-pond-5: #79B0A6;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "enchanted-garden-pond": {
        1: "#0C2C32",
        2: "#274D4F",
        3: "#426E6C",
        4: "#5E8F89",
        5: "#79B0A6",
      }
    }
  }
}

Related searches

deep pond color palettecool green blue schememystical garden UIdark aquatic themeserene nature branding

Palette colors

Hex values

Color 1#0C2C32
·
Color 2#274D4F
·
Color 3#426E6C
·
Color 4#5E8F89
·
Color 5#79B0A6
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.6:1Fail
2.6:1Fail
4.1:1AA18
6:1AA
2
1.6:1Fail
1.6:1Fail
2.6:1Fail
3.8:1AA18
3
2.6:1Fail
1.6:1Fail
1.6:1Fail
2.3:1Fail
4
4.1:1AA18
2.6:1Fail
1.6:1Fail
1.5:1Fail
5
6:1AA
3.8:1AA18
2.3:1Fail
1.5:1Fail

Similar palettes

More like Enchanted Garden Pond

View all Dark