Back to palettes

Palette

Sepia Tone Album

Classic sepia browns and creams, evoking the nostalgic warmth of cherished old photographs and memories.

neutralretro5 colors
More neutral palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#704214#A5672A#D4A15A#F5DEB3#BC9A6C

Palette guide

How to use Sepia Tone Album

Overview

The Sepia Tone Album palette combines classic sepia browns and creamy tones, perfectly evoking the nostalgic warmth of cherished old photographs and memories. Ranging from the deep #704214 to the bright #F5DEB3, with versatile mid-tones like #A5672A and #D4A15A, this collection provides a comforting and authentic vintage feel. Designers can utilize these hex codes to create branding or interfaces that convey warmth, history, and an understated elegance. Developers will find this palette excellent for crafting user experiences that feel timeless, inviting, and rich in character, ideal for projects seeking a harmonious blend of retro charm and modern usability.

Best used for

  • Vintage photography websites
  • Personal memory or genealogy sites
  • Artisan craft e-commerce platforms
  • Coffee shop or bakery branding
  • Retro-themed event invitations
  • Cozy blog or content platforms

Suggested color roles

primary

Use #704214 for strong headers, footers, or primary content areas to establish a deep, grounding presence.

secondary

Apply #A5672A for subheadings, navigation, or larger text blocks, providing a warm and readable contrast.

accent

Employ #D4A15A sparingly for interactive elements, highlights, or small graphic details to add gentle emphasis.

background

Utilize #F5DEB3 as a soft, light background, offering an inviting and highly readable canvas for content.

text

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

Accessibility notes

  • Ensure sufficient contrast when using #704214 or #A5672A for text on lighter backgrounds like #F5DEB3.
  • Avoid pairing #D4A15A with #BC9A6C for small text to prevent readability issues due to low contrast.
  • Use #F5DEB3 as the primary background for critical text to maximize legibility.
  • Test all color combinations with accessibility checkers to ensure compliance, especially for interactive elements.

Recommended combinations

Classic Layout

Ideal for clear headers on a light background with a supporting accent, perfect for content hierarchy.

#704214 · #F5DEB3 · #A5672A

Warm Tones

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

#A5672A · #D4A15A · #704214

Faded Cream

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

#BC9A6C · #D4A15A · #F5DEB3

CSS variables

:root {
  --sepia-tone-album-1: #704214;
  --sepia-tone-album-2: #A5672A;
  --sepia-tone-album-3: #D4A15A;
  --sepia-tone-album-4: #F5DEB3;
  --sepia-tone-album-5: #BC9A6C;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "sepia-tone-album": {
        1: "#704214",
        2: "#A5672A",
        3: "#D4A15A",
        4: "#F5DEB3",
        5: "#BC9A6C",
      }
    }
  }
}

Related searches

sepia tone color palettevintage album colorsold memories aestheticretro brown creamnostalgic web design

Palette colors

Hex values

Color 1#704214
·
Color 2#A5672A
·
Color 3#D4A15A
·
Color 4#F5DEB3
·
Color 5#BC9A6C
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.8:1Fail
3.6:1AA18
6.4:1AA
3.2:1AA18
2
1.8:1Fail
2:1Fail
3.5:1AA18
1.7:1Fail
3
3.6:1AA18
2:1Fail
1.8:1Fail
1.1:1Fail
4
6.4:1AA
3.5:1AA18
1.8:1Fail
2:1Fail
5
3.2:1AA18
1.7:1Fail
1.1:1Fail
2:1Fail

Similar palettes

More like Sepia Tone Album

View all neutral