Sepia Filter: How to Apply Warm Brown Tones to Images

Sepia is the warm brown tone you associate with old photographs. It started as a darkroom chemistry trick — photographers in the 1880s bathed prints in sodium sulfide, converting metallic silver to silver sulfide. The brown tone looked warm and extended print longevity by decades.

Today, sepia is purely cosmetic. The process is always the same: desaturate to remove color, then tint toward a specific brown. The tools differ, but that two-step concept holds everywhere.

Quick Reference: Sepia Methods Compared

Key Sepia Color Values

There is no single "sepia" hex value — it varies by warmth and intent:

Classic sepia (#704214) is the closest to historical darkroom prints. Use it as your baseline and adjust from there. You can explore and extract exact color values from reference images using a color picker tool.

Photoshop v26.3: Black & White + Photo Filter

Photoshop gives you the most control with two non-destructive adjustment layers:

1. Layer → New Adjustment Layer → Black & White. Adjust channel sliders to control how each color maps to gray.
2. Layer → New Adjustment Layer → Photo Filter. Select Sepia, set Density to 60–80%, enable Preserve Luminosity.

Both layers are non-destructive — original pixels stay untouched. Faster alternative: Hue/Saturation (check Colorize, Hue ~35, Saturation ~40) after desaturation. Less control, but one layer instead of two.

GIMP v2.10.38: Desaturate + Colorize

GIMP follows the same two-step approach with different menu names:

1. Colors → Desaturate → Desaturate. Choose Luminosity (HSL) — it produces the most natural gray mapping (see our grayscale guide for why).
2. Colors → Colorize. Set Hue: 35, Saturation: 50, Lightness: 0.

Hue 35 targets the warm brown range. Values from 25 (red-brown) to 45 (golden-brown) all read as sepia. Outside that range, you get a different tint entirely.

CSS: The filter: sepia() Function

For web content, CSS sepia is a one-liner:

/* CSS sepia filter — all modern browsers (Chrome 53+, Firefox 35+, Safari 9.1+) */
img.sepia {
  filter: sepia(1);    /* full sepia: 0 = none, 1 = maximum */
}

img.subtle-sepia {
  filter: sepia(0.6);  /* partial sepia retains some original color */
}

img.vintage {
  filter: sepia(0.7) contrast(1.1) brightness(0.95);
}

At sepia(1), pure white becomes #F1E7D0 and black stays #000000. You cannot change the target hue — CSS uses a fixed matrix. For custom browns, use an SVG filter instead.

CSS sepia is ideal for hover effects and galleries. It renders client-side with no server round-trip, the same philosophy behind Pixotter's conversion tools. For broader retro effects (grain, vignette, faded blacks), see our vintage photo filter guide.

ImageMagick v7.1.1: CLI Batch Processing

ImageMagick handles sepia in a single command:

# ImageMagick v7.1.1 — sepia tone with 80% intensity
magick input.jpg -sepia-tone 80% output-sepia.jpg

# Batch process every PNG in a directory
for f in *.png; do
  magick "$f" -sepia-tone 75% "sepia-${f}"
done

The percentage controls intensity: 80% is strong, 60% is subtle, 95% is nearly monochrome brown. For finer control, separate the steps:

# ImageMagick v7.1.1 — manual two-step sepia
magick input.jpg -colorspace Gray \
  -fill '#704214' -tint 80 \
  output-sepia.jpg

This desaturates first, then tints toward classic sepia #704214. The -tint value (0–100) controls brown intensity.

Python Pillow 10.4: Programmatic Sepia

For automated pipelines, Pillow gives you full matrix control:

# Requires: Pillow==10.4.0
from PIL import Image, ImageOps

def apply_sepia(image_path: str, output_path: str) -> None:
    """Apply sepia tone using a color transformation matrix."""
    img = Image.open(image_path).convert("RGB")
    grayscale = ImageOps.grayscale(img)
    sepia = Image.merge("RGB", [
        grayscale.point(lambda x: min(255, int(x * 1.2))),   # Red channel boosted
        grayscale.point(lambda x: int(x * 1.0)),              # Green channel neutral
        grayscale.point(lambda x: int(x * 0.8)),              # Blue channel reduced
    ])
    sepia.save(output_path, quality=90)

apply_sepia("photo.jpg", "photo-sepia.jpg")

The multipliers (1.2, 1.0, 0.8) control the tint — more red and less blue produces warm brown. Adjust all three to shift between warmer and cooler sepia. For the inverse operation (restoring toned images toward neutral), the invert image colors guide covers channel manipulation principles.

Lightroom Classic v14.2: Preset-Based Workflow

Lightroom handles sepia through HSL/Color → B&W (convert to monochrome) followed by Color Grading (Midtones wheel: Hue ~40, Saturation ~30 for warm brown). Save as a preset and apply across your entire library with one click — the best option for consistent sepia across hundreds of photos.

Sepia vs. Vintage vs. Black & White

These three terms are often confused:

Sepia is one specific look. Vintage is a category that might include sepia alongside grain and vignettes. Converting to black and white is the first step of sepia — you then add the brown tint on top.

Apply Sepia with Pixotter

Pixotter processes everything in your browser — no upload, no server. Drop your image, apply the sepia filter, download the result. The image never leaves your device. Need to convert your sepia image to WebP afterward? Add the conversion to the same pipeline instead of opening a separate tool.

FAQ

What hex color is sepia?

Classic sepia is approximately #704214 (RGB 112, 66, 20). Warmer variants reach #8B6914, cooler versions sit around #5E4B3B. There is no single standard — the "correct" value depends on your creative intent.

Does sepia reduce file size?

Slightly. Sepia images have less color variation, so JPEG compression works more efficiently — typically 5-15% smaller at the same quality setting. If file size is your primary goal, converting to grayscale saves more because it eliminates two color channels entirely.

Can I apply sepia with just CSS?

Yes. filter: sepia(1) for full effect, sepia(0.5) for partial. Works in all modern browsers, no JavaScript needed. The limitation: you cannot change the target brown. CSS uses a fixed matrix. For custom hues, use an SVG filter.

Is sepia the same as vintage?

No. Sepia is one specific warm brown tone applied uniformly. Vintage is a broad category that might include sepia but also adds grain, vignettes, faded blacks, and light leaks. Sepia images look similar to each other; vintage images vary widely.

What is the difference between sepia and grayscale?

Grayscale removes all color, leaving only shades of gray. Sepia starts with grayscale but adds a warm brown tint on top. The result is monochromatic (one hue) rather than achromatic (no hue). Grayscale feels cool and neutral; sepia feels warm and nostalgic.

Why were old photographs sepia-toned?

It was chemistry, not aesthetics. Sodium sulfide converted metallic silver to silver sulfide, turning the image brown and making prints far more resistant to fading. Many surviving 19th-century photographs lasted precisely because they were sepia-toned.

Can I control how warm or cool the sepia looks?

Yes, in most tools. In Photoshop, adjust the Photo Filter density and color. In GIMP, change the Hue slider (lower = redder, higher = more golden). In Pillow, change the RGB channel multipliers. In ImageMagick, specify a custom -fill color with -tint. CSS sepia() is the exception — its color matrix is fixed.

Does sepia work better on certain types of photos?

Sepia works best on portraits, landscapes, and architecture — subjects that evoke a timeless quality. It looks odd on screenshots, neon-lit scenes, and images where vivid color carries information (product photos, infographics). If color is the point, sepia removes it and adds nothing useful.