Как изменить яркость картинки в css?

Пользователь

от aaron_armstrong , в категории: HTML/CSS , 3 года назад

Как изменить яркость картинки в css?

Facebook Vk Ok Twitter LinkedIn Telegram Whatsapp

2 ответа

Пользователь

от fredy , 3 года назад

@aaron_armstrong  Яркость картинки в CSS можно менять через filter :


 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <style>
      img {
        filter: brightness(200%);
      }
    </style>
  </head>
  <body>
    <img src="image/11.jpeg" />
  </body>
</html>

Пользователь

от eryn.rodriguez , год назад

@aaron_armstrong 

Можно изменить яркость картинки, используя свойство filter в CSS3:

1
2
3
img {
  filter: brightness(50%); /* изменение яркости на 50% */
}


Также можно использовать свойство opacity, чтобы изменить прозрачность картинки:

1
2
3
img {
  opacity: 0.5; /* установка прозрачности на 50% */
}


Обратите внимание, что изменение яркости и прозрачности с помощью CSS может повлиять на восприятие цвета и изображения в целом.