Back to palettes

Palette

Sepia Tone Memory

Faded and warm, this palette evokes the nostalgic charm of antique sepia photographs and old memories.

neutralretro5 colors
More neutral palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Sepia Tone Memory 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 Sepia Tone Memory.

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

Data visualization

#8B6B4E#AD9073#D0B397#E4D5C5#5E4E3F

Palette guide

How to use Sepia Tone Memory

Overview

The Sepia Tone Memory palette presents a collection of faded and warm hues, perfectly evoking the nostalgic charm of antique sepia photographs and old memories. With grounding tones like #5E4E3F and #8B6B4E, complemented by the softer #AD9073 and #E4D5C5, this palette offers a profound sense of history and comfort. Designers can leverage these hex codes to create sophisticated, heritage-rich branding or interfaces. Developers will find this palette excellent for crafting user experiences that feel authentic, grounded, and imbued with a classic, understated elegance, ideal for projects demanding a strong, vintage aesthetic.

Best used for

  • Vintage-themed blogs or journals
  • Historic society digital archives
  • Rustic cafe or boutique branding
  • Photography portfolio websites
  • Classic literature platforms
  • Memory-sharing applications

Suggested color roles

primary

Use #5E4E3F for strong headers, footers, or prominent backgrounds, conveying depth and stability.

secondary

Apply #8B6B4E for subheadings, navigation, or larger text blocks, providing a rich, readable contrast.

accent

Employ #AD9073 sparingly for interactive elements, key highlights, or small graphic details to draw attention.

background

Utilize #E4D5C5 as a soft, warm background for content, offering a gentle and inviting canvas.

text

For body text, #5E4E3F provides excellent readability on lighter tones; a dark charcoal can also be used for optimal contrast.

Accessibility notes

  • Ensure sufficient contrast when using #5E4E3F or #8B6B4E for text on lighter backgrounds like #E4D5C5.
  • Avoid pairing #AD9073 with #D0B397 for small text to prevent readability issues due to low contrast.
  • Use #E4D5C5 as a background for critical information to maximize legibility.
  • Always test color combinations with accessibility checkers, especially for interactive elements and form fields.

Recommended combinations

Deep & Light

Ideal for clear headers on a light background with a supporting accent, establishing strong hierarchy.

#5E4E3F · #E4D5C5 · #8B6B4E

Rustic Layers

Creates a sophisticated, layered look suitable for content sections or subtle graphic elements, evoking depth.

#8B6B4E · #D0B397 · #5E4E3F

Soft Fade

Excellent for background gradients or large visual elements that require a gentle, ethereal quality.

#AD9073 · #D0B397 · #E4D5C5

CSS variables

:root {
  --sepia-tone-memory-1: #8B6B4E;
  --sepia-tone-memory-2: #AD9073;
  --sepia-tone-memory-3: #D0B397;
  --sepia-tone-memory-4: #E4D5C5;
  --sepia-tone-memory-5: #5E4E3F;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "sepia-tone-memory": {
        1: "#8B6B4E",
        2: "#AD9073",
        3: "#D0B397",
        4: "#E4D5C5",
        5: "#5E4E3F",
      }
    }
  }
}

Related searches

vintage sepia website colorsold memory color schemerustic warm brown palettefaded photography tonesclassic retro design

Palette colors

Hex values

Color 1#8B6B4E
·
Color 2#AD9073
·
Color 3#D0B397
·
Color 4#E4D5C5
·
Color 5#5E4E3F
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.6:1Fail
2.5:1Fail
3.4:1AA18
1.6:1Fail
2
1.6:1Fail
1.5:1Fail
2.1:1Fail
2.7:1Fail
3
2.5:1Fail
1.5:1Fail
1.4:1Fail
4:1AA18
4
3.4:1AA18
2.1:1Fail
1.4:1Fail
5.5:1AA
5
1.6:1Fail
2.7:1Fail
4:1AA18
5.5:1AA

Similar palettes

More like Sepia Tone Memory

View all neutral