Back to palettes

Palette

Sepia Memoir Tones

Evokes the nostalgic charm of antique photographs, steeped in warm, aged sepia tones and faded memories.

warmretro5 colors
More warm palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Sepia Memoir Tones 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 Memoir Tones.

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

Data visualization

#4d3319#6b4728#8a5e3d#ab7c5c#cc9a7c

Palette guide

How to use Sepia Memoir Tones

Overview

The Sepia Memoir Tones palette offers a beautiful gradient of warm, aged browns, perfect for evoking nostalgia and a vintage aesthetic. Ranging from the deep #4d3319 to the lighter #cc9a7c, with mid-tones like #8a5e3d, this collection captures the essence of antique photographs and cherished memories. Designers can utilize these hex codes to craft sophisticated, time-honored interfaces or branding. Developers will find this palette excellent for creating UI elements that convey warmth, history, and a subtle, inviting charm, ideal for projects seeking a classic, understated elegance.

Best used for

  • Historical website designs
  • Vintage e-commerce stores
  • Art and photography portfolios
  • Branding for artisanal products
  • Retro-themed event invitations
  • Cozy blog or content platforms

Suggested color roles

primary

Employ #4d3319 for strong headings, footers, or background elements that require a deep, grounding presence.

secondary

Use #6b4728 for subheadings, navigation, or larger text blocks, providing excellent readability and warmth.

accent

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

background

Utilize #cc9a7c as a soft, aged background color, offering a light, inviting canvas for content.

text

For body text, #4d3319 provides clear contrast on lighter tones; for maximum readability, consider a dark charcoal.

Accessibility notes

  • Ensure sufficient contrast when using #4d3319 or #6b4728 for text on lighter backgrounds like #cc9a7c.
  • Avoid pairing #8a5e3d with #ab7c5c for small text to prevent readability issues due to low contrast.
  • Use #cc9a7c as a background for critical information to maximize legibility.
  • Always test color combinations with accessibility checkers, especially for interactive elements.

Recommended combinations

Deep Foundation

Creates a strong header or footer with a light content area and a warm accent, ideal for page structure.

#4D3319 · #CC9A7C · #8A5E3D

Faded Elegance

Perfect for subtle gradients or layered background elements, evoking a soft, aged paper effect.

#6B4728 · #AB7C5C · #CC9A7C

Vintage Highlight

Good for call-to-action buttons or important links, providing a clear visual cue against a darker background.

#4D3319 · #AB7C5C · #6B4728

CSS variables

:root {
  --sepia-memoir-tones-1: #4d3319;
  --sepia-memoir-tones-2: #6b4728;
  --sepia-memoir-tones-3: #8a5e3d;
  --sepia-memoir-tones-4: #ab7c5c;
  --sepia-memoir-tones-5: #cc9a7c;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "sepia-memoir-tones": {
        1: "#4d3319",
        2: "#6b4728",
        3: "#8a5e3d",
        4: "#ab7c5c",
        5: "#cc9a7c",
      }
    }
  }
}

Related searches

sepia color schemevintage brown palettenostalgic web colorsretro design tonesaged photography colors

Palette colors

Hex values

Color 1#4d3319
·
Color 2#6b4728
·
Color 3#8a5e3d
·
Color 4#ab7c5c
·
Color 5#cc9a7c
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.4:1Fail
2.1:1Fail
3.2:1AA18
4.7:1AA
2
1.4:1Fail
1.5:1Fail
2.3:1Fail
3.3:1AA18
3
2.1:1Fail
1.5:1Fail
1.5:1Fail
2.3:1Fail
4
3.2:1AA18
2.3:1Fail
1.5:1Fail
1.5:1Fail
5
4.7:1AA
3.3:1AA18
2.3:1Fail
1.5:1Fail

Similar palettes

More like Sepia Memoir Tones

View all warm