Back to palettes

Palette

Aquatic Moss Garden

A tranquil set of deep teals and aquatic greens, like a hidden moss garden beneath clear water.

coolcalm5 colors
More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Aquatic Moss Garden 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 Aquatic Moss Garden.

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

Data visualization

#0A3C42#1C5C64#327D83#55A8AD#81D3D8

Palette guide

How to use Aquatic Moss Garden

Overview

The "Aquatic Moss Garden" palette is a tranquil set of deep teals and aquatic greens, like a hidden moss garden beneath clear water, evoking lush serenity. This cool and earthy collection features a harmonious gradient from the profound Dark Cyan #0A3C42 and the rich Dark Slate Gray #1C5C64 to the balanced Dark Greenish Blue #327D83. Lighter, more ethereal tones such as Medium Aquamarine #55A8AD and the airy Light Cyan #81D3D8 provide gentle contrast and a sense of depth. Developers can utilize these shades for sophisticated, calming interfaces that feel grounded yet refreshing. Designers will find this palette ideal for projects related to nature, organic products, wellness, or any brand seeking a serene, earthy, and naturally elegant aesthetic.

Best used for

  • Nature-inspired branding
  • Wellness and mindfulness apps
  • Organic cosmetic packaging
  • Sustainable living websites
  • Eco-friendly product design
  • Serene interior decor concepts

Suggested color roles

primary

A very deep, grounding dark cyan #0A3C42, providing a strong, sophisticated foundation for backgrounds, headers, or primary branding.

secondary

A rich dark slate gray #1C5C64 that adds depth and elegance, suitable for large content blocks, sidebars, or secondary navigation.

accent

A balanced greenish blue #327D83 that offers a subtle yet distinct accent, perfect for calls to action, important highlights, or interactive elements.

background

A light, airy cyan #81D3D8, offering a clean, refreshing backdrop that enhances the cool, serene feel of the palette.

text

Use #0A3C42 for headings on light backgrounds or white for body text on dark backgrounds like #0A3C42 or #1C5C64.

Accessibility notes

  • Ensure sufficient contrast for light text (e.g., white or #81D3D8) against dark backgrounds like #0A3C42 and #1C5C64.
  • The lighter shades like #55A8AD and #81D3D8 are generally not suitable for small body text; use a dark neutral.
  • Use a very dark neutral (e.g., black or charcoal) for all body text on the lightest backgrounds to ensure wcag compliance.
  • Interactive elements should have clear visual feedback, potentially using the slightly brighter #327D83 for hover states.

Recommended combinations

Deep Moss Base

For establishing a deep, calming base in websites or apps, with dark cyan as primary, light cyan as background, and dark slate gray for panels.

#0A3C42 · #81D3D8 · #1C5C64

Watery Shimmer

Ideal for gradients or visual effects that simulate light filtering through water, adding a subtle, ethereal quality.

#327D83 · #55A8AD · #81D3D8

Lush Focus

Effective for highlighting important information or calls to action, using the balanced greenish blue against a rich dark slate gray, with dark cyan for text.

#1C5C64 · #327D83 · #0A3C42

CSS variables

:root {
  --aquatic-moss-garden-1: #0A3C42;
  --aquatic-moss-garden-2: #1C5C64;
  --aquatic-moss-garden-3: #327D83;
  --aquatic-moss-garden-4: #55A8AD;
  --aquatic-moss-garden-5: #81D3D8;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "aquatic-moss-garden": {
        1: "#0A3C42",
        2: "#1C5C64",
        3: "#327D83",
        4: "#55A8AD",
        5: "#81D3D8",
      }
    }
  }
}

Related searches

aquatic green paletteserene teal bluemoss garden colorslush water designcalm earthy tones

Palette colors

Hex values

Color 1#0A3C42
·
Color 2#1C5C64
·
Color 3#327D83
·
Color 4#55A8AD
·
Color 5#81D3D8
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.6:1Fail
2.5:1Fail
4.4:1AA18
7:1AAA
2
1.6:1Fail
1.6:1Fail
2.7:1Fail
4.4:1AA18
3
2.5:1Fail
1.6:1Fail
1.7:1Fail
2.8:1Fail
4
4.4:1AA18
2.7:1Fail
1.7:1Fail
1.6:1Fail
5
7:1AAA
4.4:1AA18
2.8:1Fail
1.6:1Fail

Similar palettes

More like Aquatic Moss Garden

View all cool
Cerulean Coastline Calm
Koi Water Garden
Aegean Coast Whisper
Alpine Lake Serene
Aquatic Coral Garden
Arctic Glacier Lagoon