Некоторые методы, которые используются для создания затемняющего наложения с помощью CSS:

1. Использование псевдоэлемента ::before или ::after. 3 В этом случае создаётся «виртуальный» элемент, который накладывается поверх фонового изображения и затемняет его. 3
2. Использование линейного градиента. 3 Линейный градиент с двумя одинаковыми полупрозрачными цветами используется в свойстве background-image вместе с самим изображением. 3 В этом случае оверлей создаётся непосредственно в фоне элемента. 3
3. Применение режимов наложения. 2 Для этого используются свойства mix-blend-mode или background-blend-mode. 2 Свойство mix-blend-mode применяет смешивание ко всему элементу, а background-blend-mode — к фону элемента. 2