Filter css сделать

CSS фильтры позволяют изменять внешний вид элементов, добавляя эффекты, такие как размытие, насыщенность, яркость и многие другие. С помощью свойства filter вы можете применять различные фильтры к своим элементам.

Вот несколько примеров, как можно задать свойство filter в CSS:

img {
  filter: grayscale(50%);
}

div {
  filter: blur(5px);
}

h1 {
  filter: contrast(200%);
}

a {
  filter: hue-rotate(90deg);
}

button {
  filter: invert(100%);
}

ul li {
  filter: opacity(50%);
}

Здесь мы применили различные фильтры к различным типам элементов. Свойство grayscale() создает черно-белый эффект, blur() – размытие, contrast() – увеличивает контрастность, hue-rotate() – изменяет оттенок элемента, invert() – инвертирует цвета, opacity() – изменяет прозрачность.

Можно также объединять несколько фильтров, перечисляя их через пробелы. Например:

img {
  filter: grayscale(50%) blur(5px);
}

Такой код создаст эффект черно-белого изображения с небольшим размытием.

Обратите внимание, что некоторые фильтры могут сильно изменять внешний вид элементов и их легко переборщить. Будьте осторожны с использованием эффектов и рекомендуется тестировать их на различных устройствах и браузерах.