sepia() CSS Function

Description

The sepia() CSS function turns the image into sepia - the so-called black-and-white image with a brown tint. Sepia gives photographs an old look.

Syntax

sepia() = filter: sepia(<number>);

Values

  • <number>A value of 0% or 0 leaves the image unchanged. A value of 100% or 1 completely turns the image into sepia. Any values ​​from 0% to 100% or from 0 to 1 linearly apply the effect.
    A negative value is not allowed. An empty value is taken as 0.

Example

<img class="sepia" src="images/nature.jpg" alt="Nature Image">
.sepia {

    filter: sepia(100%);

}

Browser Support

Desktop
Explorer Edge Chrome Firefox Opera Safari
X125335409.1
Tablets / Mobile
Android Chrome Firefox Opera Safari Samsung
535335419.36.0

Last updated by CSSPortal on: 1st December 2019