Некоторые современные методы создания затемнения в веб-дизайне:

• Использование свойства filter. 5 Оно позволяет применять к элементам различные графические эффекты, включая настройку яркости. 5 Функция brightness() помогает осветлить или затемнить изображение. 5 Значение ниже 100% делает изображение темнее за счёт уменьшения яркости. 5
• Применение свойства background-image с линейным градиентом. 5 Этот метод включает наложение полупрозрачного чёрного линейного градиента поверх изображения для создания эффекта затемнения. 5 Градиент обеспечивает лучшую контрастность для удобства чтения. 5
• Использование псевдоэлементов. 1 Например, псевдоэлемент ::after может добавить тёмный фон на элемент. 1 Благодаря абсолютному позиционированию он будет полностью перекрывать изображение, словно окутывая его тенью. 1 Плавные переходы делают эффект более естественным. 1
• Создание внутренней тени. 1 Для этого можно использовать box-shadow с inset и RGBA. 1 В результате получится эффект виньетирования: края изображения станут затемнёнными, а центр останется светлым. 1
• Интерактивное затемнение. 1 Для создания такого эффекта используют свойства transition. 1 Например, можно создать затемнение при наведении курсора. 1

Также при создании тёмной темы в интерфейсе используют правило подбора цветов: чем темнее фон, тем светлее должны быть цвета элементов интерфейса. 4