# Функция sepia

Функция `sepia` позволяет сделать из фонового изображения сепию - черно-белое изображение с коричневым оттенком. Значение `0` обозначает, что изображение останется исходным. Значение `100%` или `1` полностью превращает фон в сепию. Любое число расположенное в данном диапазоне задает применение сепии линейно. Отрицательное значение нельзя задавать. По умолчанию значение равно `0`.

## Синтаксис

`селектор { filter: sepia(число); }`

## Пример

Давайте сделаем из нашего изображения полную сепию:

`<div id="elem"></div>` `#elem { filter: sepia(100%); background: url("bg.png") center / cover no-repeat; width: 400px; height: 300px; border: 1px solid black; }`

:

## Пример

А теперь давайте снизим применение сепии на `50%`:

`<div id="elem"></div>` `#elem { filter: sepia(50%); background: url("bg.png") center / cover no-repeat; width: 400px; height: 300px; border: 1px solid black; }`

:

## Пример

А теперь давайте зададим в функции `sepia` значение равное `0`:

`<div id="elem"></div>` `#elem { filter: sepia(0); background: url("bg.png") center / cover no-repeat; width: 400px; height: 300px; border: 1px solid black; }`

:

## Смотрите также

- функция `blur`,
  которая размывает фон
- функция `brightness`,
  которая задает яркость фону
- функция `contrast`,
  которая задает контрастность фону
- функция `drop-shadow`,
  которая задает тень фону
- функция `hue-rotate`,
  которая задает цветность фону
- функция `invert`,
  которая инвертирует цвета фона
- функция `opacity`,
  которая задает прозрачность фону
- свойство `background`,
  представляющее собой свойство-сокращение для фона
- свойство `background-image`,
  с помощью которого блоку можно задать фоновую картинку
- свойство `filter`,
  которое задает стиль для фона

← →
↑
en ru