Palette

Ancient Indigo Dye

Rich, profound blues reflecting the time-honored process and deep saturation of ancient indigo dyes.

CoolCalm5 colors

More Cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Ancient Indigo Dye 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 Ancient Indigo Dye.

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

Data visualization

#2C3E50#4A6C8B#7CA2C8#1A2733#0F1B22

Palette guide

How to use Ancient Indigo Dye

Overview

The Ancient Indigo Dye palette captures the profound depth and traditional richness of indigo, offering a sophisticated range of blues. Featuring a deep navy #2C3E50, a classic medium blue #4A6C8B, and a lighter, serene #7CA2C8, this collection is ideal for projects seeking a blend of tradition, calm, and professionalism. Developers and designers can utilize these versatile blues to create trustworthy interfaces, elegant branding, or tranquil digital experiences. The palette is grounded by two even darker, almost black-blue shades: #1A2733 and #0F1B22, providing robust options for backgrounds, shadows, and strong typography, ensuring a cohesive and deeply resonant visual language.

Best used for

Corporate or financial services websites
Educational institution branding
Maritime or nautical-themed designs
Traditional craft or textile businesses
Relaxation or meditation apps
Websites requiring a trustworthy and stable aesthetic

Suggested color roles

primary

Apply #2C3E50 (Deep Navy) for main navigation, headers, or foundational branding elements, conveying authority and depth.

secondary

Utilize #4A6C8B (Medium Blue) for secondary content blocks, interactive elements, or illustrations, providing a softer contrast.

accent

Highlight key information, links, or calls-to-action with #7CA2C8 (Light Blue), offering a refreshing and clear visual cue.

background

The deepest #0F1B22 (Very Dark Blue) can serve as a sophisticated, immersive background, especially when paired with white text.

text

For dark backgrounds, use white or light grey. For lighter backgrounds like #7CA2C8, use #1A2733 or black for excellent readability.

Accessibility notes

Ensure sufficient contrast when using #7CA2C8 (Light Blue) for text on #4A6C8B (Medium Blue) or similar mid-tone backgrounds.
Pair white or a very light gray with #2C3E50, #1A2733, and #0F1B22 for text to meet WCAG AA contrast standards.
The darkest shades, #1A2733 and #0F1B22, offer excellent contrast for light text, making them suitable for important headings or buttons.
Avoid using #4A6C8B as text on #7CA2C8 without checking contrast ratios, as it might be too subtle for readability.

Recommended combinations

Deep Ocean

Excellent for creating a layered, professional look, suitable for corporate or educational platforms.

#2C3E50 · #4A6C8B · #7CA2C8

Indigo Depths

Ideal for a strong, immersive background or for a sophisticated, minimalist design with depth.

#0F1B22 · #1A2733 · #2C3E50

Sky & Sea

Use for progressive disclosure of information or for a gradient effect, moving from light to deep blue.

#7CA2C8 · #4A6C8B · #2C3E50

CSS variables

:root {
  --ancient-indigo-dye-1: #2C3E50;
  --ancient-indigo-dye-2: #4A6C8B;
  --ancient-indigo-dye-3: #7CA2C8;
  --ancient-indigo-dye-4: #1A2733;
  --ancient-indigo-dye-5: #0F1B22;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "ancient-indigo-dye": {
        1: "#2C3E50",
        2: "#4A6C8B",
        3: "#7CA2C8",
        4: "#1A2733",
        5: "#0F1B22",
      }
    }
  }
}

Hex values

Color 1#2C3E50

Color 2#4A6C8B

Color 3#7CA2C8

Color 4#1A2733

Color 5#0F1B22

Accessibility

Contrast checker

2:1Fail

4.1:1AA18

1.4:1Fail

1.6:1Fail

2:1Fail

2.1:1Fail

2.8:1Fail

3.2:1AA18

4.1:1AA18

2.1:1Fail

5.7:1AA

6.5:1AA

1.4:1Fail

2.8:1Fail

5.7:1AA

1.2:1Fail

1.6:1Fail

3.2:1AA18

6.5:1AA

1.2:1Fail

Similar palettes

More like Ancient Indigo Dye

View all Cool

Indigo Dye House

Indigo Ocean Depth

Celestial Ocean Twilight

Enchanted Riverbed

Faded Denim Wash

Ocean Dreamscape