Back to palettes

Palette

Aged Teal Canvas

Muted teal and cool greys blend to suggest a timeworn fabric or painting, full of gentle character.

coolretro5 colors
More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Aged Teal Canvas 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 Aged Teal Canvas.

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

Data visualization

#008B8B#20B2AA#778899#B0C4DE#C0C0C0

Palette guide

How to use Aged Teal Canvas

Overview

The Aged Teal Canvas palette blends muted teal and cool greys, suggesting a timeworn fabric or painting full of gentle character. With vibrant #008B8B and #20B2AA, alongside soft greys #778899, #B0C4DE, and #C0C0C0, this collection is perfect for designers and developers seeking an elegant, retro, or serene aesthetic. These hex codes provide a sophisticated foundation for projects that require a calming yet distinctive presence, ideal for conveying a sense of history, artistry, and understated beauty across various applications.

Best used for

  • Coastal-themed branding and decor
  • Vintage apparel design
  • Art gallery website themes
  • Spa and wellness center branding
  • Sophisticated home textiles marketing
  • Documentary film title sequences

Suggested color roles

primary

Utilize #008B8B as the dominant, deep teal for main headers, navigation, or dominant brand elements, providing a focal point.

secondary

Apply #20B2AA for supporting sections, subheadings, or larger content blocks, offering a brighter, refreshing teal.

accent

Highlight key information or interactive elements with #778899, a soft blue-grey that introduces subtle contrast.

background

Choose #B0C4DE for light, airy backgrounds, evoking a faded canvas or clear sky, enhancing readability.

text

For optimal readability on light backgrounds, #008B8B provides strong contrast. On darker backgrounds like #20B2AA, #C0C0C0 works well for text.

Accessibility notes

  • Ensure sufficient contrast between #B0C4DE and lighter text colors like #C0C0C0 for readability.
  • The darkest color, #008B8B, provides excellent contrast for text on #B0C4DE or #778899.
  • Avoid using #C0C0C0 as text on #778899 unless for very large, decorative headlines.
  • Prioritize contrast for interactive elements to ensure clear user feedback and usability.

Recommended combinations

Teal & Grey Harmony

Ideal for a balanced layout with a strong teal, a muted grey accent, and a soft, cool background.

#008B8B · #778899 · #B0C4DE

Faded Coastal

Excellent for creating a layered, serene feel with brighter teal elements on a light grey background, grounded by dark teal.

#20B2AA · #C0C0C0 · #008B8B

Canvas Texture

Perfect for subtle transitions or soft, inviting sections, moving from a light background to muted cool tones.

#B0C4DE · #778899 · #20B2AA

CSS variables

:root {
  --aged-teal-canvas-1: #008B8B;
  --aged-teal-canvas-2: #20B2AA;
  --aged-teal-canvas-3: #778899;
  --aged-teal-canvas-4: #B0C4DE;
  --aged-teal-canvas-5: #C0C0C0;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "aged-teal-canvas": {
        1: "#008B8B",
        2: "#20B2AA",
        3: "#778899",
        4: "#B0C4DE",
        5: "#C0C0C0",
      }
    }
  }
}

Related searches

muted teal color palettevintage blue grey designaged canvas aestheticelegant cool tonesfaded seafoam color scheme

Palette colors

Hex values

Color 1#008B8B
·
Color 2#20B2AA
·
Color 3#778899
·
Color 4#B0C4DE
·
Color 5#C0C0C0
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.6:1Fail
1.1:1Fail
2.3:1Fail
2.3:1Fail
2
1.6:1Fail
1.4:1Fail
1.5:1Fail
1.4:1Fail
3
1.1:1Fail
1.4:1Fail
2:1Fail
2:1Fail
4
2.3:1Fail
1.5:1Fail
2:1Fail
1:1Fail
5
2.3:1Fail
1.4:1Fail
2:1Fail
1:1Fail

Similar palettes

More like Aged Teal Canvas

View all cool
Faded Denim Patina
Mid-Century Aqua Teal
Vintage Postcard Blue
Atomic Era Pulse
Denim Dream
Faded Denim Patina