Palette

Vintage Postcard Sepia

Faded browns and creams evoke a sense of history, like old photographs or a treasured vintage postcard.

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

#6A4E3B#9B7D60#D0BBA7#EAD8C7#FBF5EF

Palette guide

How to use Vintage Postcard Sepia

Overview

The "Vintage Postcard Sepia" palette offers a harmonious gradient of warm, muted browns and creams, perfectly capturing the delicate essence of aged paper and faded historical documents. From the deep, grounding #6A4E3B to the almost-white #FBF5EF, each shade contributes to a cohesive, soft, and inviting aesthetic. The mid-tones of #9B7D60, #D0BBA7, and #EAD8C7 provide versatile layers for depth and 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 history, quiet elegance, and authentic nostalgia, ideal for storytelling and heritage-focused projects.

Best used for

Historical archive websites or digital libraries
Branding for artisanal paper goods or stationery
UI/UX for journaling or memory-keeping apps
E-commerce platforms for antique books or prints
Editorial design for scholarly articles or memoirs
Websites with a focus on heritage crafts or traditional arts

Suggested color roles

primary

A deep, rich brown #6A4E3B, ideal for strong headings, primary navigation, or prominent brand elements, providing a sense of gravitas and history.

secondary

A warm, mid-tone brown #9B7D60 that complements the primary, suitable for subheadings, important links, or background sections.

accent

A light, creamy brown #D0BBA7 that provides a subtle accent, perfect for delicate borders, hover states, or secondary informational text.

background

A soft, warm, near-white cream #FBF5EF, offering a clean, expansive, and inviting canvas that enhances the sepia effect.

text

For readable body text on light backgrounds like #FBF5EF or #EAD8C7, #6A4E3B ensures optimal contrast and maintaining the palette's warmth. A standard dark charcoal like #333333 is also an option.

Accessibility notes

Ensure #6A4E3B text on #FBF5EF or #EAD8C7 provides sufficient contrast for WCAG AA.
Avoid using #D0BBA7 or #EAD8C7 for small text on very light backgrounds as readability will be compromised.
Use the darker browns (#6A4E3B, #9B7D60) for interactive elements to ensure clear visibility and affordance.
When using #9B7D60 as a background, pair it with #FBF5EF for text or a very dark neutral for optimal contrast.

Recommended combinations

Gradual Sepia

Elegant website design: #6A4E3B for headers, #FBF5EF for primary background, and #D0BBA7 for subtle card elements.

#6A4E3B · #FBF5EF · #D0BBA7

Aged Paper

Content blocks: #EAD8C7 as a base, #9B7D60 for subheadings, and #6A4E3B for body text or quotes.

#9B7D60 · #EAD8C7 · #6A4E3B

Soft Contrast

UI accents: #FBF5EF for a clean canvas, #D0BBA7 for borders, and #9B7D60 for subtle icons or hover states.

#FBF5EF · #D0BBA7 · #9B7D60

CSS variables

:root {
  --vintage-postcard-sepia-3-1: #6A4E3B;
  --vintage-postcard-sepia-3-2: #9B7D60;
  --vintage-postcard-sepia-3-3: #D0BBA7;
  --vintage-postcard-sepia-3-4: #EAD8C7;
  --vintage-postcard-sepia-3-5: #FBF5EF;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "vintage-postcard-sepia-3": {
        1: "#6A4E3B",
        2: "#9B7D60",
        3: "#D0BBA7",
        4: "#EAD8C7",
        5: "#FBF5EF",
      }
    }
  }
}

Hex values

Color 1#6A4E3B

Color 2#9B7D60

Color 3#D0BBA7

Color 4#EAD8C7

Color 5#FBF5EF

Accessibility

Contrast checker

2:1Fail

4.1:1AA18

5.5:1AA

7:1AAA

2:1Fail

2.1:1Fail

2.8:1Fail

3.5:1AA18

4.1:1AA18

2.1:1Fail

1.3:1Fail

1.7:1Fail

5.5:1AA

2.8:1Fail

1.3:1Fail

7:1AAA

3.5:1AA18

1.7:1Fail

1.3: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

Gradual Sepia

Aged Paper

Soft Contrast

CSS variables

Tailwind config

Related searches

Hex values

Contrast checker

More like Vintage Postcard Sepia