Apply a warm vintage sepia tone to images

Apply a warm sepia treatment to a raster image with adjustable intensity.

freeworks offlinenothing uploaded
ToolSepia Filter
Input
Output
—
Put this on your own site

The frame below runs the same code as this page, in the reader's own browser. Nothing is sent to us, and nothing is sent to you.

Pick a dark background and the text and panels follow it, so the frame stays readable on a dark page.

Preview

How it works

Canvas redraws the source through a CSS sepia factor between zero and one. The filter shifts RGB mixtures toward warm brown while preserving dimensions.

  • Intensity 1 is full sepia.
  • Intensity 0 is the identity.

Worked example

Apply full sepia
Input
											Input: data:image/png;base64,iVBORw0KGgo=
Intensity: 1
Output
												PNG data URL with a full sepia treatment

When to use this

Photo editors create aged prints, poster mock-ups preview warm monochrome, and CSS lessons compare filter functions.

Edge cases

  • Full sepia preserves luminance differences rather than making every pixel one brown.
  • Intermediate intensity blends filtered and original appearance.
  • Transparent areas keep alpha while visible colours change.

References