Дизайнеры любят размытый фон. И дело легко решалось бы вставко | Webber
Дизайнеры любят размытый фон. И дело легко решалось бы вставкой сразу размытой картинки. Но не тут-то было. Картинка должна меняться или при наведении переставать быть размытой. Грузить 2 картинки это слишком жестоко. Так нам приходилось поступать раньше. Но теперь можно сделать всё хорошо всего одной строчкой в CSS
backdrop-filter: blur(5px);
Вот ссылка на MDN
CSS свойство backdrop-filter позволяет вам использовать визуальные эффекты - такие как размытие или смещение цвета фона - за элементом. Так как это применяется ко всему за элементом, чтобы увидеть эффект, вы должны сделать элемент или его фон по крайней мере частично прозрачными.