Skip to main content
vibrant

Navy and Verdigris

6.55:1 contrast ratio —

AA

Visual Preview

#001F3FNavy
#43B3AEVerdigris

The quick brown fox

Body text — Navy on Verdigris

Supporting text at reduced opacity

Badge

Reversed — Verdigris on Navy

Inverted combination preview

Contrast Analysis

Contrast Ratio

6.55:1

AA

WCAG AA

✓ Pass

Requires 4.5:1

WCAG AA Large

✓ Pass

Requires 3:1

WCAG AAA

✗ Fail

Requires 7:1

Color Values

Navy

Foreground (Text)

HEX
#001F3F
RGB
rgb(0, 31, 63)
HSL
hsl(210, 100%, 12%)

Verdigris

Background

HEX
#43B3AE
RGB
rgb(67, 179, 174)
HSL
hsl(177, 46%, 48%)

Design Use Cases

  • UI components
  • Navigation
  • Call-to-action buttons
  • Form labels

Industry Recommendations

Technology
Healthcare Tech
Travel
Aquatics
Innovation

Color Psychology

The Navy tone evokes trust, stability, and professionalism, while Verdigris brings balance, tranquility, and clarity. Together, they create a balanced palette suited for compelling visual communication.

Palette Exports

:root {
  --color-navy: #001F3F;
  --color-verdigris: #43B3AE;
}

.combo-navy-verdigris {
  color: var(--color-navy);
  background-color: var(--color-verdigris);
}

Quick Snippets

CSS Variables

:root {
  --color-navy: #001F3F;
  --color-verdigris: #43B3AE;
}

Tailwind CSS

<div class="bg-teal-500 text-slate-900">
  Your content here
</div>

Individual Colors

Similar Combinations