Back to palettes

Palette

Tranquil Stone Pond

Calm and reflective, capturing the subtle beauty of still water surrounded by grey stones.

coolcalm5 colors
More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Tranquil Stone 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 Tranquil Stone Pond.

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

Data visualization

#AAB7B8#7F8C8D#5D6D7E#2E4053#4A6376

Palette guide

How to use Tranquil Stone Pond

Overview

The "Tranquil Stone Pond" palette captures the reflective beauty of still water surrounded by cool, grey stones. This sophisticated collection features deep, enigmatic blues like #2E4053 and #4A6376, complemented by versatile greys such as #5D6D7E, #7F8C8D, and the lighter #AAB7B8. It's an excellent choice for designs that require depth, serenity, and a touch of understated elegance. Developers will find these hues ideal for creating immersive digital environments, professional dashboards, or branding that conveys reliability and calm. The palette offers a robust foundation for a design system, ensuring harmony across various elements.

Best used for

  • Luxury automotive branding
  • Financial services websites
  • High-end tech product interfaces
  • Environmental awareness campaigns
  • Meditation and wellness apps
  • Architectural visualization projects

Suggested color roles

primary

Use #2E4053 (Dark Midnight Blue) for main headings, navigation, or calls to action, providing a strong, authoritative presence.

secondary

Apply #4A6376 (Deep Blue-Grey) for subheadings, secondary buttons, or background panels, offering a rich, complementary depth.

accent

Employ #AAB7B8 (Light Blue-Grey) for subtle highlights, interactive element states, or delicate borders to introduce a hint of lightness.

background

Utilize #7F8C8D (Medium Blue-Grey) to provide a sophisticated, muted base that enhances content visibility and maintains a serene atmosphere.

text

Use #2E4053 (Dark Midnight Blue) for body text, offering a deep, elegant alternative to black while ensuring excellent contrast.

Accessibility notes

  • #2E4053 on #AAB7B8 offers excellent contrast for text, ensuring high readability.
  • Ensure #7F8C8D provides sufficient contrast when used as a background, especially with lighter text.
  • Avoid placing #AAB7B8 text on #7F8C8D backgrounds for critical information due to potential low contrast.
  • Always verify contrast ratios for all text and interactive elements to meet WCAG standards, particularly for navigation.

Recommended combinations

Deep Waters

Perfect for a sophisticated hero section, using the deepest blue for focus, light for accents, and a mid-blue for depth.

#2E4053 · #AAB7B8 · #4A6376

Stone Reflection

Ideal for background gradients or layered UI elements, creating a subtle, contemplative visual flow.

#7F8C8D · #5D6D7E · #AAB7B8

Pond Edge

Effective for content cards or data points, providing clear hierarchy and a refined, cool aesthetic.

#2E4053 · #5D6D7E · #AAB7B8

CSS variables

:root {
  --tranquil-stone-pond-1: #AAB7B8;
  --tranquil-stone-pond-2: #7F8C8D;
  --tranquil-stone-pond-3: #5D6D7E;
  --tranquil-stone-pond-4: #2E4053;
  --tranquil-stone-pond-5: #4A6376;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "tranquil-stone-pond": {
        1: "#AAB7B8",
        2: "#7F8C8D",
        3: "#5D6D7E",
        4: "#2E4053",
        5: "#4A6376",
      }
    }
  }
}

Related searches

cool blue grey paletteserene nature colorsdark blue grey schemeprofessional calm UIstone water inspired colors

Palette colors

Hex values

Color 1#AAB7B8
·
Color 2#7F8C8D
·
Color 3#5D6D7E
·
Color 4#2E4053
·
Color 5#4A6376
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.7:1Fail
2.6:1Fail
5.2:1AA
3:1AA18
2
1.7:1Fail
1.5:1Fail
3.1:1AA18
1.8:1Fail
3
2.6:1Fail
1.5:1Fail
2:1Fail
1.2:1Fail
4
5.2:1AA
3.1:1AA18
2:1Fail
1.7:1Fail
5
3:1AA18
1.8:1Fail
1.2:1Fail
1.7:1Fail

Similar palettes

More like Tranquil Stone Pond

View all cool
Moonlit Cove
Aegean Coast Whisper
Alpine Mist
Aquatic Moss Garden
Arctic Glacier Lagoon
Azure Lagoon Dream