Palette

Twilight Pond Whisper

Calm blues and soft greens mimic the tranquil reflections on a still pond as twilight descends.

coolcalm5 colors

More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Twilight Pond Whisper 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 Twilight Pond Whisper.

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

Data visualization

#1E2A3A#3A5E6B#6B9CA5#B0D8D9#E2F2F2

Palette guide

How to use Twilight Pond Whisper

Overview

The "Twilight Pond Whisper" palette offers a serene blend of cool blues and soft greens, perfect for evoking tranquility and natural calm. This collection features a deep, mysterious blue-green (#1E2A3A) grounding the composition, complemented by a richer teal (#3A5E6B) and a softer, muted aqua (#6B9CA5). Lighter tones like the airy light blue (#B0D8D9) and the almost-white pale aqua (#E2F2F2) provide gentle contrast and highlight. Designers and developers can leverage this palette for projects requiring a soothing, sophisticated, and nature-inspired aesthetic. It's excellent for creating depth without harshness, making it versatile for both digital interfaces and print materials.

Best used for

Nature-themed websites or apps
Spa and wellness branding
Eco-conscious product packaging
Serene interior design concepts
Digital illustrations of landscapes
Educational materials on aquatic life

Suggested color roles

primary

Use #1E2A3A (Deep Blue-Green) for foundational elements, headers, or backgrounds that need to convey stability and depth.

secondary

Employ #3A5E6B (Rich Teal) for subheadings, navigation menus, or prominent graphical elements, offering a slightly lighter yet still substantial presence.

accent

Apply #6B9CA5 (Muted Aqua) for interactive elements, call-to-action buttons, or subtle highlights that need to stand out gently without being overpowering.

background

Utilize #E2F2F2 (Pale Aqua) as a soft, near-white base that provides an airy, clean canvas for content, ensuring high readability.

text

For primary body text on light backgrounds like #E2F2F2, use #1E2A3A or #3A5E6B to ensure excellent readability.

Accessibility notes

Ensure sufficient contrast between #1E2A3A or #3A5E6B and #E2F2F2 for body text.
The contrast of #6B9CA5 for text on #B0D8D9 may be insufficient; verify readability carefully.
Only use #E2F2F2 for text on very dark backgrounds, such as #1E2A3A, to maintain legibility.
Avoid using #B0D8D9 directly on #E2F2F2 for critical information due to low contrast.

Recommended combinations

Deep Serenity

Perfect for creating a calm, deep header with light text and a clean background.

#1E2A3A · #B0D8D9 · #E2F2F2

Aqua Flow

Ideal for content sections, using the teal as a heading, aqua for details, and pale aqua for the body.

#3A5E6B · #6B9CA5 · #E2F2F2

Reflective Highlights

Good for UI elements, where the darkest tone grounds, aqua highlights, and teal provides secondary information.

#1E2A3A · #6B9CA5 · #3A5E6B

CSS variables

:root {
  --twilight-pond-whisper-1: #1E2A3A;
  --twilight-pond-whisper-2: #3A5E6B;
  --twilight-pond-whisper-3: #6B9CA5;
  --twilight-pond-whisper-4: #B0D8D9;
  --twilight-pond-whisper-5: #E2F2F2;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "twilight-pond-whisper": {
        1: "#1E2A3A",
        2: "#3A5E6B",
        3: "#6B9CA5",
        4: "#B0D8D9",
        5: "#E2F2F2",
      }
    }
  }
}

Hex values

Color 1#1E2A3A

Color 2#3A5E6B

Color 3#6B9CA5

Color 4#B0D8D9

Color 5#E2F2F2

Accessibility

Contrast checker

2.1:1Fail

4.8:1AA

9.4:1AAA

12.6:1AAA

2.1:1Fail

2.3:1Fail

4.6:1AA

6.1:1AA

4.8:1AA

2.3:1Fail

2:1Fail

2.6:1Fail

9.4:1AAA

4.6:1AA

2:1Fail

1.3:1Fail

12.6:1AAA

6.1:1AA

2.6:1Fail

1.3:1Fail

Similar palettes

More like Twilight Pond Whisper

View all cool

Aquatic Coral Garden

Aquatic Moss Garden

Arctic Northern Bloom

Celestial Oasis Dream

Cerulean Coastline Calm

Evergreen Snowfall Chill