Back to palettes

Palette

Serene Lake Reflect

Tranquil blues and peaceful aquas reflect the smooth, still surface of a serene lake at twilight.

coolcalm5 colors
More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Serene Lake Reflect 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 Serene Lake Reflect.

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

Data visualization

#2E5C7A#4C8CA5#7ABDD9#1F455C#153645

Palette guide

How to use Serene Lake Reflect

Overview

The Serene Lake Reflect palette captures the smooth, still surface of a lake at twilight, offering tranquil blues and peaceful aquas. Ranging from the profound depth of #153645 to the clear, bright #7ABDD9, and including sophisticated mid-tones like #2E5C7A and #4C8CA5, this palette exudes calm and contemplation. It's an ideal choice for designers aiming to create elegant, introspective, and professional visual experiences. Developers can leverage these deep, harmonious blues for high-end corporate websites, educational platforms, or any digital space requiring a sophisticated, calming, and trustworthy aesthetic, promoting focus and serenity.

Best used for

  • Luxury brand websites
  • Corporate presentations and reports
  • Meditation and contemplation apps
  • Financial services interfaces
  • Nautical or maritime themed designs
  • Evening wear fashion branding

Suggested color roles

primary

#2E5C7A - A deep, sophisticated blue, perfect for establishing a strong, trustworthy, and elegant brand presence.

secondary

#4C8CA5 - A slightly lighter, more inviting blue for subheadings, active states, or supporting graphic elements.

accent

#7ABDD9 - A clear, bright aqua that provides a refreshing highlight, ideal for calls-to-action or key information.

background

#153645 - A very deep, almost black-blue, excellent for dramatic, immersive backgrounds or dark mode interfaces.

text

#7ABDD9 on #153645 for lighter text, or a crisp white for optimal readability on darker blues.

Accessibility notes

  • Ensure sufficient contrast when using #7ABDD9 for text against very light backgrounds if used.
  • #153645 provides excellent contrast for text on #7ABDD9, ensuring readability.
  • Avoid using #4C8CA5 on #7ABDD9 for small text due to potential low contrast.
  • For best readability on darker blues like #1F455C or #153645, use a bright white or a very light gray.

Recommended combinations

Twilight Depths

A dramatic, high-contrast pairing for impactful headlines or dark mode UI with a bright, clear accent.

#153645 · #7ABDD9 · #2E5C7A

Reflective Surface

A smooth, sophisticated gradient for backgrounds or layered UI elements, evoking depth and clarity.

#2E5C7A · #4C8CA5 · #7ABDD9

Still Waters

A bright accent on a deep background, balanced by a mid-tone for secondary content and visual interest.

#7ABDD9 · #153645 · #4C8CA5

CSS variables

:root {
  --serene-lake-reflect-1: #2E5C7A;
  --serene-lake-reflect-2: #4C8CA5;
  --serene-lake-reflect-3: #7ABDD9;
  --serene-lake-reflect-4: #1F455C;
  --serene-lake-reflect-5: #153645;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "serene-lake-reflect": {
        1: "#2E5C7A",
        2: "#4C8CA5",
        3: "#7ABDD9",
        4: "#1F455C",
        5: "#153645",
      }
    }
  }
}

Related searches

serene blue gray palettedeep lake reflection colorstranquil twilight schemesophisticated blue brandingcalm professional UI

Palette colors

Hex values

Color 1#2E5C7A
·
Color 2#4C8CA5
·
Color 3#7ABDD9
·
Color 4#1F455C
·
Color 5#153645
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.9:1Fail
3.5:1AA18
1.4:1Fail
1.8:1Fail
2
1.9:1Fail
1.8:1Fail
2.7:1Fail
3.4:1AA18
3
3.5:1AA18
1.8:1Fail
4.9:1AA
6.1:1AA
4
1.4:1Fail
2.7:1Fail
4.9:1AA
1.3:1Fail
5
1.8:1Fail
3.4:1AA18
6.1:1AA
1.3:1Fail

Similar palettes

More like Serene Lake Reflect

View all cool