Palette

Vintage Postcard Sepia

Soft, desaturated browns and creams evoke the antique charm of faded sepia postcards.

neutralretro5 colors

More neutral palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Vintage Postcard Sepia 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 Postcard Sepia.

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

Data visualization

#5A4D4A#8B7E7B#BBA8A1#E8DCDC#F2F0ED

Palette guide

How to use Vintage Postcard Sepia

Overview

The "Vintage Postcard Sepia" palette offers a refined and subtle gradient of cool-toned browns and near-whites, perfectly capturing the sophisticated essence of faded sepia photographs and antique documents. From the deep, anchoring #5A4D4A to the delicate #F2F0ED, each color contributes to a cohesive, soft, and understated aesthetic. The mid-tones of #8B7E7B, #BBA8A1, and #E8DCDC provide versatile layers for depth and gentle contrast without harshness. This palette is an excellent choice for designers and developers aiming to create digital or print experiences that exude a sense of quiet history, timeless elegance, and authentic, muted nostalgia, ideal for sophisticated storytelling.

Best used for

High-end photography portfolios with a vintage aesthetic
Branding for luxury antique dealers or art galleries
UI/UX for minimalist design apps or historical data visualization
E-commerce platforms for bespoke, handcrafted goods
Editorial design for fine art publications or historical memoirs
Websites focused on cultural heritage or archival content

Suggested color roles

primary

A deep, sophisticated cool brown #5A4D4A, ideal for strong headings, primary navigation, or prominent brand elements, providing a grounding, elegant presence.

secondary

A rich, mid-tone cool brown #8B7E7B that complements the primary, suitable for subheadings, important links, or background sections.

accent

A light, rosy-brown #BBA8A1 that provides a subtle accent, perfect for delicate borders, hover states, or secondary informational text, adding a touch of warmth.

background

A very soft, near-white with a hint of warmth #F2F0ED, offering a clean, expansive, and inviting canvas that enhances the muted sepia effect.

text

For readable body text on light backgrounds like #F2F0ED or #E8DCDC, #5A4D4A ensures optimal contrast and maintaining the palette's sophisticated tone. A standard dark charcoal like #222222 is also an option.

Accessibility notes

Ensure #5A4D4A text on #F2F0ED or #E8DCDC provides sufficient contrast for WCAG AA.
Avoid using #BBA8A1 or #E8DCDC for small text on very light backgrounds as readability will be compromised.
Use the darker browns (#5A4D4A, #8B7E7B) for interactive elements to ensure clear visibility and affordance.
When using #8B7E7B as a background, pair it with #F2F0ED for text or a very dark neutral for optimal contrast.

Recommended combinations

Elegant Fading

Sophisticated web layout: #5A4D4A for headers, #F2F0ED for primary background, and #BBA8A1 for subtle decorative elements.

#5A4D4A · #F2F0ED · #BBA8A1

Muted Story

Content blocks: #E8DCDC as a base, #8B7E7B for subheadings, and #5A4D4A for body text or quotes, creating a narrative flow.

#8B7E7B · #E8DCDC · #5A4D4A

Soft Accents

UI elements: #F2F0ED for card backgrounds, #BBA8A1 for borders, and #8B7E7B for subtle icons or hover states.

#F2F0ED · #BBA8A1 · #8B7E7B

CSS variables

:root {
  --vintage-postcard-sepia-4-1: #5A4D4A;
  --vintage-postcard-sepia-4-2: #8B7E7B;
  --vintage-postcard-sepia-4-3: #BBA8A1;
  --vintage-postcard-sepia-4-4: #E8DCDC;
  --vintage-postcard-sepia-4-5: #F2F0ED;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "vintage-postcard-sepia-4": {
        1: "#5A4D4A",
        2: "#8B7E7B",
        3: "#BBA8A1",
        4: "#E8DCDC",
        5: "#F2F0ED",
      }
    }
  }
}

Hex values

Color 1#5A4D4A

Color 2#8B7E7B

Color 3#BBA8A1

Color 4#E8DCDC

Color 5#F2F0ED

Accessibility

Contrast checker

2.1:1Fail

3.6:1AA18

6.1:1AA

7.1:1AAA

2.1:1Fail

1.7:1Fail

2.9:1Fail

3.4:1AA18

3.6:1AA18

1.7:1Fail

2:1Fail

6.1:1AA

2.9:1Fail

1.7:1Fail

1.2:1Fail

7.1:1AAA

3.4:1AA18

2:1Fail

1.2:1Fail

Similar palettes

Vintage Postcard Sepia

See it in context.

Ready when you are.

Built with Vintage Postcard Sepia.

How to use Vintage Postcard Sepia

Overview

Best used for

Suggested color roles

Accessibility notes

Recommended combinations

Elegant Fading

Muted Story

Soft Accents

CSS variables

Tailwind config

Related searches

Hex values

Contrast checker

More like Vintage Postcard Sepia