Back to palettes

Palette

Indigo Reef Current

Dive into the serene depths where indigo currents gently sway through vibrant, unexplored coral reefs.

coolcalm5 colors
More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Indigo Reef Current 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 Indigo Reef Current.

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

Data visualization

#0A1B2A#1B3C4F#3A698F#6A9BC0#D2E0E7

Palette guide

How to use Indigo Reef Current

Overview

The 'Indigo Reef Current' palette invites users to dive into serene depths where indigo currents gently sway through vibrant, unexplored coral reefs. This captivating collection, featuring the profound #0A1B2A, the deep #1B3C4F, and the rich #3A698F, alongside the luminous #6A9BC0 and the airy #D2E0E7, offers a refreshing and sophisticated gradient. Designers can leverage these hues to evoke tranquility, clarity, and a sense of natural wonder, perfect for projects requiring a harmonious blend of depth and lightness. Developers will find this palette excellent for crafting immersive user interfaces and branding that feels both established and refreshingly clear.

Best used for

  • Marine or environmental conservation websites
  • Travel and tourism branding for coastal destinations
  • Wellness and spa interfaces with a calming theme
  • Educational platforms focusing on oceanography
  • Luxury resort or nautical-themed product packaging
  • Digital art and illustration depicting underwater scenes

Suggested color roles

primary

Utilize #0A1B2A as the foundational deep indigo for headers, footers, or large content blocks, conveying stability and depth.

secondary

Employ #1B3C4F for secondary navigation, subheadings, or important content panels, maintaining a strong, cohesive visual.

accent

Apply #6A9BC0 or the very light #D2E0E7 sparingly for interactive elements, calls-to-action, or highlight states, offering a luminous contrast.

background

The lightest shade, #D2E0E7, or a crisp white, works beautifully as a clean background. A subtle gradient using #6A9BC0 could also be effective.

text

On lighter backgrounds, #0A1B2A provides excellent readability. On darker blues, pure white or the very light #D2E0E7 ensures clarity.

Accessibility notes

  • Ensure #0A1B2A and #1B3C4F have sufficient contrast against #D2E0E7 or white for body text.
  • Avoid using #6A9BC0 for small text on mid-tone blues like #3A698F due to potential contrast issues.
  • Always check contrast ratios for text over #3A698F, especially if the text color is also a mid-tone.
  • For interactive elements using #D2E0E7, ensure they have sufficient visual distinction from non-interactive content.

Recommended combinations

Reef Depths

Excellent for creating a strong, authoritative base in environmental branding, evoking deep ocean.

#0A1B2A · #1B3C4F · #3A698F

Current Flow

Ideal for differentiating content sections or creating a gentle visual hierarchy, mimicking light in water.

#3A698F · #6A9BC0 · #D2E0E7

Oceanic Contrast

Use the lighter blues as accents against the deep primary for dynamic calls-to-action or highlights.

#0A1B2A · #6A9BC0 · #D2E0E7

CSS variables

:root {
  --indigo-reef-current-1: #0A1B2A;
  --indigo-reef-current-2: #1B3C4F;
  --indigo-reef-current-3: #3A698F;
  --indigo-reef-current-4: #6A9BC0;
  --indigo-reef-current-5: #D2E0E7;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "indigo-reef-current": {
        1: "#0A1B2A",
        2: "#1B3C4F",
        3: "#3A698F",
        4: "#6A9BC0",
        5: "#D2E0E7",
      }
    }
  }
}

Related searches

indigo reef color paletteocean blue calm designwater current color schemedeep blue light blue webmarine themed UI colors

Palette colors

Hex values

Color 1#0A1B2A
·
Color 2#1B3C4F
·
Color 3#3A698F
·
Color 4#6A9BC0
·
Color 5#D2E0E7
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.5:1Fail
3:1Fail
5.9:1AA
12.9:1AAA
2
1.5:1Fail
2:1Fail
3.9:1AA18
8.6:1AAA
3
3:1Fail
2:1Fail
2:1Fail
4.3:1AA18
4
5.9:1AA
3.9:1AA18
2:1Fail
2.2:1Fail
5
12.9:1AAA
8.6:1AAA
4.3:1AA18
2.2:1Fail

Similar palettes

More like Indigo Reef Current

View all cool