CSS Attributes Index CSS Filters
Renders an input image in sepia mode.
{ filter: sepia(number | percentage) }
number |
Absolute positive floating-point number or a relative percentage value. |
The property is read/write with a default value of 1.
The sepia( ) CSS function renders a visual object as a sepia data type, akin to the antique brown color palette of photographs in the past.
The passed parameter defines the amount of deviation from the element’s default color palette.
A value of 0 or 0% leaves the input unchanged, while a value of 1 or 100% changes the input image completely to sepia.
Values between 0 and 1 or 0% and 100% have linear multipliers on the effect.
Values more than 1 ( or >100% ) are ignored and render as 1 or 100%.
Negative values ( < 0 ) are ignored and render the element unchanged.
Sepia with values between 0 and 1 or between 0% and 100%.
filter: sepia(0) |
filter: sepia(.5) |
filter: sepia(.75) |
 |
 |
 |
|
filter: sepia(30%) |
filter: sepia(60%) |
filter: sepia(100%) |
 |
 |
 |
Sepia with a negative value or with a value more than 1 or more than 100%.
filter: sepia(-10) |
filter: sepia(100) |
filter: sepia(200%) |
 |
 |
 |
grayscale hue-rotate invert opacity saturate