Palette

Deep Ocean Bloom

Plunge into the mysterious blue depths where bioluminescent life flourishes in silent, hidden gardens.

cooldark5 colors

More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Deep Ocean Bloom 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 Ocean Bloom.

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

Data visualization

#0A1128#001F54#034078#0A65B1#1282A2

Palette guide

How to use Deep Ocean Bloom

Overview

The Deep Ocean Bloom palette plunges into mysterious blue depths, perfect for designs requiring sophistication and intrigue. Anchored by the profound #0A1128, it builds depth with #001F54 and #034078, reminiscent of the ocean's vastness. Lighter, captivating hues like #0A65B1 and #1282A2 emerge as bioluminescent accents, offering designers and developers a rich spectrum for striking visual contrasts. This collection is ideal for creating immersive digital experiences, luxury branding, or any project aiming for an elegant, deep-sea aesthetic. Its cool, dark tones provide a strong foundation, while the brighter blues ensure visual interest and clarity.

Best used for

Luxury brand identity
High-end tech product interfaces
Marine conservation organization websites
Sci-fi game environments and UI
Elegant dark mode themes
Underwater photography portfolios

Suggested color roles

primary

Use #0A1128 as the foundational dark blue for backgrounds or main structural elements, conveying stability and depth.

secondary

Employ #001F54 for secondary backgrounds, large blocks of color, or as a rich border color, complementing the primary shade.

accent

Apply #1282A2 for interactive elements, calls to action, or highlights to draw attention and add a pop of vibrant contrast.

background

The deepest hue, #0A1128, is excellent for dark, immersive backgrounds, while #001F54 can serve as a slightly lighter, rich background for content sections.

text

For optimal readability on dark backgrounds like #0A1128 or #001F54, use white or a very light grey text. Consider #1282A2 for large, impactful headings.

Accessibility notes

Ensure white or very light grey text has sufficient contrast against #0A1128, #001F54, and #034078 backgrounds.
When using #0A65B1 or #1282A2 for text, verify WCAG AA contrast ratios, especially on mid-tone backgrounds.
Avoid using lighter blues like #0A65B1 for small text on backgrounds such as #034078 due to potential readability issues.
Test interactive elements (buttons, links) in all states to ensure they maintain accessible contrast ratios.

Recommended combinations

Deep Contrast

Ideal for creating a strong visual hierarchy with a dark base and vibrant, eye-catching accents.

#0A1128 · #0A65B1 · #1282A2

Subtle Depth

Perfect for gradients, layered elements, or content blocks that require a cohesive, evolving blue scheme.

#001F54 · #034078 · #0A65B1

Core Foundation

Excellent for establishing the primary dark background and main structural components of a design.

#0A1128 · #001F54 · #034078

CSS variables

:root {
  --deep-ocean-bloom-2-1: #0A1128;
  --deep-ocean-bloom-2-2: #001F54;
  --deep-ocean-bloom-2-3: #034078;
  --deep-ocean-bloom-2-4: #0A65B1;
  --deep-ocean-bloom-2-5: #1282A2;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "deep-ocean-bloom-2": {
        1: "#0A1128",
        2: "#001F54",
        3: "#034078",
        4: "#0A65B1",
        5: "#1282A2",
      }
    }
  }
}

Hex values

Color 1#0A1128

Color 2#001F54

Color 3#034078

Color 4#0A65B1

Color 5#1282A2

Accessibility

Contrast checker

1.2:1Fail

1.8:1Fail

3.1:1AA18

4.2:1AA18

1.2:1Fail

1.5:1Fail

2.7:1Fail

3.6:1AA18

1.8:1Fail

1.5:1Fail

1.7:1Fail

2.4:1Fail

3.1:1AA18

2.7:1Fail

1.7:1Fail

1.4:1Fail

4.2:1AA18

3.6:1AA18

2.4:1Fail

1.4:1Fail

Similar palettes

More like Deep Ocean Bloom

View all cool

Abyssal Bioluminescence

Abyssal Current Glide

Bioluminescent Abyss

Deep Ocean Currents

Deep Ocean Trench

Midnight Ocean Trench