Navy Blue, Coral Red and Mint Green
- Paolo Casula
- 2 days ago
- 2 min read

Here’s a fresh trio that brings bold energy and calm balance to any project:
Swatch | Hex Code | Role | Best Fit |
Navy Blue | Primary/Base | Logo mark or header background—anchors the design with professionalism and depth. | |
Coral Red | Secondary/Accent | Buttons, highlights, icons—injects vibrancy and emotional impact. | |
Mint Green | Highlight/Tone | Background panels, info boxes, subtle overlays—softens the palette and offers breathing space. |
Contrast & Readability
Navy & Coral: High contrast (≈7.3:1), ideal for headline text on banners or clear CTA labels.
Navy & Mint: Good contrast (≈4.6:1), perfect for subheadings or data visualization elements against a colored background.
Coral & Mint: Moderate contrast (≈2.9:1), suited for secondary buttons, badges, or hover states where you want interest without glaring brightness.
Shades, Tints & Light
Tints
Lighten Coral Red by ~30% (#F28C8C) for hover states or background accents behind dark text.
Lighten Navy Blue by ~20% (#576B89) to create depth in section dividers or chart fills.
Shades
Darken Mint Green by ~15% (#8ABCAA) for footer backgrounds or secondary text on mint areas.
Darken Coral Red by ~10% (#C5333F) for pressed-button states or icon outlines.
Usage Across Formats
Logo
Base shape or text in Navy Blue.
Accent icon detail in Coral Red for memorability.
Website
Navy Blue header/nav, with Mint Green background behind content sections.
Coral Red for primary CTAs and link hovers.
Poster
Bold headline in Navy Blue.
Key callouts or date/time in Coral Red.
Background gradients or shapes in a mint tint for visual interest.
Banner
Use a diagonal split or gradient from Coral Red to Navy Blue.
Overlay text or icons in Mint Green (or white) to pop against the vibrant stripe.
This palette balances stability (Navy), excitement (Coral), and freshness (Mint) to guide viewer attention and maintain a friendly, modern aesthetic across all brand touchpoints.
Comments