Palette

Vintage Postmark Charm

Soft, muted tones reminiscent of old postcards, evoking a nostalgic sense of travel and bygone eras.

neutralretro5 colors

More neutral palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Vintage Postmark Charm 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 Vintage Postmark Charm.

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

Data visualization

#F0E5D0#D9C7AC#BCA488#8F7A65#625447

Palette guide

How to use Vintage Postmark Charm

Overview

The Vintage Postmark Charm palette offers a delightful gradient of soft, muted browns and creams, perfectly capturing the nostalgic essence of aged paper and handwritten letters. With hues ranging from a delicate Old Lace `#F0E5D0` to a grounding Coffee `#625447`, alongside warm intermediate tones like Light Taupe `#D9C7AC`, Dark Tan `#BCA488`, and Bistre `#8F7A65`, this palette is ideal for designers and developers seeking a gentle, authentic retro feel. It evokes a sense of quiet charm, history, and craftsmanship, making it perfect for projects that value subtlety and a timeless aesthetic.

Best used for

Stationery and invitation design
Historical content and archival websites
Branding for artisan goods or cozy cafes
Personal blogs with a warm, intimate feel
Vintage-inspired wedding themes
UI backgrounds for tranquil applications

Suggested color roles

primary

Utilize `#625447` (Coffee) for strong text, primary navigation, or foundational elements to provide depth and legibility.

secondary

Apply `#8F7A65` (Bistre) for secondary headings, borders, or as a rich complementary shade.

accent

Employ `#F0E5D0` (Old Lace) for delicate highlights, background textures, or light text on darker elements to add softness.

background

The soft `#F0E5D0` (Old Lace) or `#D9C7AC` (Light Taupe) creates an inviting, aged-paper canvas for content.

text

For body text, `#625447` (Coffee) provides excellent contrast, or use a deep charcoal for maximum readability.

Accessibility notes

Ensure high contrast for text, especially when using lighter shades like `#D9C7AC` or `#BCA488` on similar backgrounds.
The lightest color, `#F0E5D0`, should only be used for text if paired with one of the darkest colors in the palette.
Prioritize using `#625447` or `#8F7A65` for critical text elements to ensure readability across devices.
Always test color combinations using a contrast checker to meet WCAG accessibility guidelines.

Recommended combinations

Soft Antique

Excellent for creating a clean, legible layout with a gentle vintage appeal.

#F0E5D0 · #BCA488 · #625447

Earthy Depth

Ideal for layered backgrounds, graphic elements, or subtle transitions in design.

#625447 · #8F7A65 · #D9C7AC

Faded Warmth

Use for delicate patterns, background details, or soft branding accents.

#D9C7AC · #BCA488 · #F0E5D0

CSS variables

:root {
  --vintage-postmark-charm-1: #F0E5D0;
  --vintage-postmark-charm-2: #D9C7AC;
  --vintage-postmark-charm-3: #BCA488;
  --vintage-postmark-charm-4: #8F7A65;
  --vintage-postmark-charm-5: #625447;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "vintage-postmark-charm": {
        1: "#F0E5D0",
        2: "#D9C7AC",
        3: "#BCA488",
        4: "#8F7A65",
        5: "#625447",
      }
    }
  }
}

Hex values

Color 1#F0E5D0

Color 2#D9C7AC

Color 3#BCA488

Color 4#8F7A65

Color 5#625447

Accessibility

Contrast checker

1.3:1Fail

1.9:1Fail

3.3:1AA18

5.8:1AA