Palette

Jade Pond Reflection

A tranquil blend of jade and teal, evoking the serene surface of a calm pond.

coolcalm5 colors

More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#2A4E4F#4C7D7E#88C2BB#C3E5E3#1E3B3B

Palette guide

How to use Jade Pond Reflection

Overview

The Jade Pond Reflection palette offers a tranquil blend of jade and teal, evoking the serene surface of a calm pond. With colors ranging from the deep, grounding `#1E3B3B` to the airy `#C3E5E3`, this palette is ideal for creating a peaceful, cool, and minimalist aesthetic. Designers can leverage `#4C7D7E` as a balanced primary hue, while `#2A4E4F` and `#88C2BB` provide versatile mid-tones. This collection ensures a harmonious visual experience, promoting feelings of calm and natural purity, making it excellent for spa, wellness, and environmentally conscious design applications.

Best used for

Spa and wellness center branding
Aquatic-themed websites and apps
Minimalist interior design concepts
Environmental conservation initiatives
Yoga and meditation app interfaces
Peaceful and calming digital illustrations

Suggested color roles

primary

Use `#4C7D7E` for main headings, interactive elements, and key brand accents. It's calm and inviting.

secondary

Apply `#1E3B3B` for navigation, footers, or as a strong background to establish depth and ensure readability.

accent

Reserve `#C3E5E3` for subtle highlights, delicate illustrations, or as a very light background for emphasis.

background

Employ `#88C2BB` for primary content areas, providing a soft, refreshing, and serene backdrop.

text

Utilize `#1E3B3B` for all body text to ensure maximum readability and a cohesive, tranquil look.

Accessibility notes

Ensure `#1E3B3B` provides sufficient contrast against lighter shades like `#88C2BB` and `#C3E5E3` for text.
Avoid using `#C3E5E3` for any text elements as it lacks sufficient contrast against most backgrounds.
When using lighter tones for interactive elements, verify their contrast with surrounding colors.
White text on `#1E3B3B` or `#2A4E4F` offers excellent readability and a crisp, clean appearance.

Recommended combinations

Deep Water

Creates a deep, layered effect, perfect for hero sections or establishing a sense of depth and tranquility.

#1E3B3B · #2A4E4F · #4C7D7E

Surface Glow

Offers a soft, harmonious progression, ideal for backgrounds, subtle gradients, or decorative elements.

#4C7D7E · #88C2BB · #C3E5E3

Calm Contrast

Combines strong grounding with light, ethereal tones, suitable for clean layouts and clear information hierarchy.

#1E3B3B · #88C2BB · #C3E5E3

CSS variables

:root {
  --jade-pond-reflection-1: #2A4E4F;
  --jade-pond-reflection-2: #4C7D7E;
  --jade-pond-reflection-3: #88C2BB;
  --jade-pond-reflection-4: #C3E5E3;
  --jade-pond-reflection-5: #1E3B3B;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "jade-pond-reflection": {
        1: "#2A4E4F",
        2: "#4C7D7E",
        3: "#88C2BB",
        4: "#C3E5E3",
        5: "#1E3B3B",
      }
    }
  }
}

Hex values

Color 1#2A4E4F

Color 2#4C7D7E

Color 3#88C2BB

Color 4#C3E5E3

Color 5#1E3B3B

Accessibility

Contrast checker

2:1Fail

4.6:1AA

6.8:1AA

1.3:1Fail

2:1Fail

2.3:1Fail

3.4:1AA18

2.6:1Fail

4.6:1AA

2.3:1Fail

1.5:1Fail

6:1AA

6.8:1AA

3.4:1AA18

1.5:1Fail

9:1AAA

1.3:1Fail

2.6:1Fail

6:1AA

9:1AAA

Similar palettes

More like Jade Pond Reflection

View all cool

Alpine Lake Serene

Bamboo Forest Mist

Coastal Seafoam Whisper

Coastal Seaglass Shimmer

Forest Stream Pebbles

Green Tea Serenity