Palette

Deep Sea Lullaby

Graduated blues descending into the tranquil, mysterious depths of the silent ocean.

darkcalm5 colors

More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Deep Sea Lullaby 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 Deep Sea Lullaby.

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

Data visualization

#000080#191970#4169E1#6495ED#B0C4DE

Palette guide

How to use Deep Sea Lullaby

Overview

The Deep Sea Lullaby palette presents a beautiful gradient of blues, descending into the tranquil, mysterious depths of the silent ocean. From the profound #000080 to the serene #B0C4DE, this collection offers a calming yet sophisticated aesthetic, perfect for designs that require a sense of peace, stability, or gentle guidance. The harmonious progression of shades like #191970, #4169E1, and #6495ED allows for seamless visual flow and the creation of immersive, tranquil backgrounds. Designers can leverage this palette to evoke trust, professionalism, or a comforting sense of escapism, making it highly versatile for various applications.

Best used for

Wellness and relaxation apps or websites
Sleep aid product packaging
Children's book illustrations (night themes)
Financial institution branding (trust)
Serene background themes for presentations
Luxury resort or spa marketing

Suggested color roles

primary

Use #000080 as the dominant background or brand color to establish a deep, peaceful, and authoritative foundation.

secondary

Apply #191970 for major content sections, navigation, or as a slightly lighter dark tone to add subtle visual structure.

accent

Highlight interactive elements, calls to action, or key visual features with #B0C4DE, providing a gentle, calming contrast.

background

The deep #000080 creates an excellent, unobtrusive canvas, ensuring content stands out with optimal readability for light text.

text

For primary text, use crisp white or a very pale blue-gray (e.g., #F0F8FF) on dark backgrounds. #6495ED can be used for headings on darker blues.

Accessibility notes

Ensure sufficient contrast for text, especially when using #6495ED or #B0C4DE on darker backgrounds like #000080 or #191970.
The subtle differences between the darkest shades might not provide enough contrast for functional elements; use them primarily for aesthetic depth.
Always check text and background color combinations against WCAG guidelines for readability, especially for small font sizes.
Avoid using #4169E1 as a primary text color on similar mid-tone blues; reserve it for larger headings or accents.

Recommended combinations

Oceanic Calm

Creates a deep, tranquil base with a soft, ethereal highlight for headings or important UI elements, evoking peace.

#000080 · #191970 · #B0C4DE

Blue Progression

Ideal for seamless background transitions, subtle hover effects, or progressive disclosure in user interfaces, with graduated blues.

#191970 · #4169E1 · #6495ED

Lullaby Contrast

Perfect for a deep background, a vibrant blue for calls to action, and a supportive mid-blue for secondary elements.

#000080 · #6495ED · #4169E1

CSS variables

:root {
  --deep-sea-lullaby-1: #000080;
  --deep-sea-lullaby-2: #191970;
  --deep-sea-lullaby-3: #4169E1;
  --deep-sea-lullaby-4: #6495ED;
  --deep-sea-lullaby-5: #B0C4DE;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "deep-sea-lullaby": {
        1: "#000080",
        2: "#191970",
        3: "#4169E1",
        4: "#6495ED",
        5: "#B0C4DE",
      }
    }
  }
}

Hex values

Color 1#000080

Color 2#191970

Color 3#4169E1

Color 4#6495ED

Color 5#B0C4DE

Accessibility

Contrast checker

1.1:1Fail

3.3:1AA18

5.4:1AA

9:1AAA

1.1:1Fail

3.1:1AA18

5:1AA

8.3:1AAA

3.3:1AA18

3.1:1AA18

1.6:1Fail

2.7:1Fail

5.4:1AA

5:1AA

1.6:1Fail

1.7:1Fail

9:1AAA

8.3:1AAA

2.7:1Fail

1.7:1Fail

Similar palettes

More like Deep Sea Lullaby

View all dark

Abyssal Bloom Depths

Midnight Indigo Reverie

Moonless Lake Reflection

Ocean Kelp Forest

Starry Night Veil

Winter Twilight Hues