Какие CSS `filter` вы знаете?

Question

Accepted Answer

## Часто используемые функции

```css
.img {
  filter:
    blur(4px)
    brightness(1.1)
    contrast(1.2)
    grayscale(0.5)
    hue-rotate(90deg)
    invert(0)
    opacity(0.9)
    saturate(1.3)
    sepia(0.2)
    drop-shadow(0 4px 8px rgba(0,0,0,.35));
}
```

Также `url(#svgFilter)` для SVG-фильтров.

## Нюансы

`filter` создаёт новый containing block / влияет на stacking; может бить по perf на больших слоях. `backdrop-filter` — отдельное свойство для фона позади.