Palette

Still Pond Reflection

Captures the serene, quiet atmosphere of a still pond reflecting a muted sky at dusk.

coolcalm5 colors

More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Still Pond Reflection 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 Still Pond Reflection.

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

Data visualization

#728C8C#A7BCCB#C2D5E1#4E6E6E#3C5A5A

Palette guide

How to use Still Pond Reflection

Overview

The Still Pond Reflection palette offers a tranquil blend of muted blues and greens, evoking the serene atmosphere of a quiet pond at dusk. Featuring the deep forest green of #3C5A5A, the calming teal of #4E6E6E, and the soft, reflective tones of #728C8C, #A7BCCB, and #C2D5E1, this collection is ideal for creating a sense of peace and understated elegance. Designers and developers can leverage these harmonious shades to build interfaces and branding that feel grounded, natural, and soothing, perfect for wellness, nature, or minimalist themes. Its gentle progression from dark to light allows for versatile application across various design elements.

Best used for

Nature-inspired branding and logos
Meditation or wellness app interfaces
Eco-friendly product packaging
Serene interior design mood boards
Digital art with a calm, reflective theme
Website designs for spas or retreats

Suggested color roles

primary

#4E6E6E - A balanced, earthy teal that anchors the palette without being overly dark. Excellent for main content blocks or primary brand elements.

secondary

#A7BCCB - A soft, cool blue-grey that complements the primary, bringing a gentle lightness. Use for secondary headings, accents, or background textures.

accent

#3C5A5A - A deep, rich forest green that adds depth and a touch of sophistication. Ideal for calls to action, important icons, or subtle highlights.

background

#C2D5E1 - A very light, airy blue-grey that provides a clean, expansive canvas. Perfect for page backgrounds, modal overlays, or card elements.

text

#3C5A5A - This deep green offers excellent readability against lighter backgrounds like #C2D5E1 or #A7BCCB, providing a natural, organic feel instead of stark black.

Accessibility notes

Ensure sufficient contrast when using #728C8C for text on lighter backgrounds like #C2D5E1.
Pair darker shades like #3C5A5A or #4E6E6E with #C2D5E1 or #A7BCCB for optimal text readability.
Avoid using #A7BCCB or #C2D5E1 as text colors on similarly light backgrounds to prevent low contrast issues.
When creating UI elements, check button states and hover effects for distinct visual changes with adequate contrast.

Recommended combinations

Deep Reflection

Use #3C5A5A for bold headings, #C2D5E1 as a light background, and #728C8C for subtext or decorative elements, creating a clear hierarchy.

#3C5A5A · #C2D5E1 · #728C8C

Muted Harmony

Combine #4E6E6E for primary content, #A7BCCB for secondary details, and #C2D5E1 for a soft, expansive background in tranquil layouts.

#4E6E6E · #A7BCCB · #C2D5E1

Subtle Contrast

Use #728C8C for large blocks, #3C5A5A for impactful text or buttons, and #A7BCCB for a delicate border or highlight.

#728C8C · #3C5A5A · #A7BCCB

CSS variables

:root {
  --still-pond-reflection-1: #728C8C;
  --still-pond-reflection-2: #A7BCCB;
  --still-pond-reflection-3: #C2D5E1;
  --still-pond-reflection-4: #4E6E6E;
  --still-pond-reflection-5: #3C5A5A;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "still-pond-reflection": {
        1: "#728C8C",
        2: "#A7BCCB",
        3: "#C2D5E1",
        4: "#4E6E6E",
        5: "#3C5A5A",
      }
    }
  }
}

Hex values

Color 1#728C8C

Color 2#A7BCCB

Color 3#C2D5E1

Color 4#4E6E6E

Color 5#3C5A5A

Accessibility

Contrast checker

1.8:1Fail

2.4:1Fail

1.5:1Fail

2.1:1Fail

1.8:1Fail

1.3:1Fail

2.8:1Fail

3.8:1AA18

2.4:1Fail

1.3:1Fail

3.7:1AA18

5:1AA

1.5:1Fail

2.8:1Fail

3.7:1AA18

1.3:1Fail

2.1:1Fail

3.8:1AA18

5:1AA

1.3:1Fail

Similar palettes

More like Still Pond Reflection

Still Pond Reflection

See it in context.

Ready when you are.

Built with Still Pond Reflection.

How to use Still Pond Reflection

Overview

Best used for

Suggested color roles

Accessibility notes

Recommended combinations

Deep Reflection

Muted Harmony

Subtle Contrast

CSS variables

Tailwind config

Related searches

Hex values

Contrast checker

More like Still Pond Reflection