Palette

Mid-Century Aqua Teal

Cool, subdued aqua and teal tones reminiscent of elegant 1950s interior design and furnishings.

coolretro5 colors

More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Mid-Century Aqua Teal 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 Mid-Century Aqua Teal.

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

Data visualization

#204C4F#3D6C6D#5E8F8F#82B3B2#A6D9D7

Palette guide

How to use Mid-Century Aqua Teal

Overview

The Mid-Century Aqua Teal palette offers a cool, subdued elegance reminiscent of 1950s interior design, blending sophisticated aqua and teal tones. This collection features a harmonious gradient, from the deep #204C4F to the airy #A6D9D7, with a balanced mid-tone like #5E8F8F. Designers and developers can utilize this palette to craft vintage-inspired branding, serene website themes, and elegant digital interfaces. Its timeless appeal and calming presence make it ideal for projects aiming for a nostalgic yet refined aesthetic, ensuring a sense of tranquility and classic style.

Best used for

Vintage-inspired branding and product packaging
Retro website themes and digital interfaces
Interior design concepts with a 1950s flair
Elegant fashion and lifestyle blogs
Nostalgic event invitations and stationery
Serene wellness or spa brand identities

Suggested color roles

primary

#204C4F - A deep, rich teal, perfect for foundational elements, headers, or dominant brand colors to convey depth and sophistication.

secondary

#3D6C6D - A supportive mid-dark teal, ideal for navigation, secondary content blocks, or subtle graphic elements.

accent

#82B3B2 - A lighter, refreshing aqua, excellent for calls to action, interactive elements, or delicate decorative accents.

background

#A6D9D7 - A very light, airy aqua, providing a clean, open, and serene backdrop for content.

text

#204C4F - The deepest teal, offering strong readability for primary text on lighter backgrounds, or use a dark charcoal for general body text.

Accessibility notes

Ensure #204C4F or #3D6C6D text on #A6D9D7 backgrounds meets WCAG AA contrast standards.
#82B3B2 might have insufficient contrast for small text on #A6D9D7; reserve it for larger accents or graphics.
Verify that interactive elements stand out clearly against their background, especially when using lighter shades.
For optimal readability, use the darkest shades for body text and lighter shades for headings or accents.

Recommended combinations

Retro Elegance

A sophisticated blend of deep, mid, and light teal for a classic, layered look.

#204C4F · #5E8F8F · #A6D9D7

Aqua Serenity

A calming combination with a mid-tone base, lighter accent, and airy background.

#3D6C6D · #82B3B2 · #A6D9D7

Teal Depth

Monochromatic layering of teal shades to create depth and visual interest without high contrast.

#204C4F · #3D6C6D · #5E8F8F

CSS variables

:root {
  --mid-century-aqua-teal-1: #204C4F;
  --mid-century-aqua-teal-2: #3D6C6D;
  --mid-century-aqua-teal-3: #5E8F8F;
  --mid-century-aqua-teal-4: #82B3B2;
  --mid-century-aqua-teal-5: #A6D9D7;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "mid-century-aqua-teal": {
        1: "#204C4F",
        2: "#3D6C6D",
        3: "#5E8F8F",
        4: "#82B3B2",
        5: "#A6D9D7",
      }
    }
  }
}

Hex values

Color 1#204C4F

Color 2#3D6C6D

Color 3#5E8F8F

Color 4#82B3B2

Color 5#A6D9D7

Accessibility

Contrast checker

1.6:1Fail

2.6:1Fail

4.1:1AA18

6.1:1AA

1.6:1Fail

2.5:1Fail

3.8:1AA18

2.6:1Fail

1.6:1Fail

2.3:1Fail

4.1:1AA18

2.5:1Fail

1.6:1Fail

1.5:1Fail

6.1:1AA

3.8:1AA18

2.3:1Fail

1.5:1Fail

Similar palettes

More like Mid-Century Aqua Teal

Mid-Century Aqua Teal

See it in context.

Ready when you are.

Built with Mid-Century Aqua Teal.

How to use Mid-Century Aqua Teal

Overview

Best used for

Suggested color roles

Accessibility notes

Recommended combinations

Retro Elegance

Aqua Serenity

Teal Depth

CSS variables

Tailwind config

Related searches

Hex values

Contrast checker

More like Mid-Century Aqua Teal