Recomendaciones de cursos:

Función brightness() de CSS

Definición y uso de CSS brightness() La función de filtro se utiliza para ajustar la luminosidad del elemento.

• 0% haría que la imagen se volviera completamente oscura
• 100% (o 1) es el valor predeterminado, que representa la imagen original
• Un valor superior al 100% haría que la imagen fuera más brillante
• Un valor inferior al 100% haría que la imagen se oscureciera

Ejemplo

Ejemplo 1

Hacer que la imagen sea más oscura o más brillante que la imagen original:

#img1 {
  filter: brightness(150%);
}
#img2 {
  filter: brightness(50%);
}

Prueba por ti mismo

Ejemplo 2

convierte brightness() con backdrop-filter Uso combinado de propiedades:

div.transbox {
  background-color: rgba(255, 255, 255, 0.4);
  -webkit-backdrop-filter: brightness(150%);
  backdrop-filter: brightness(150%);
  padding: 20px;
  margin: 30px;
  font-weight: bold;
}

Prueba por ti mismo

Sintaxis de CSS

brightness(amount)

Detalles técnicos

Compatibilidad del navegador

Los números en la tabla representan la versión del navegador que admite completamente la función por primera vez.

Páginas relacionadas

Referencia:Atributo filter de CSS

Referencia:Función blur() de CSS

Referencia:Función contrast() de CSS

Referencia:Función drop-shadow() de CSS

Referencia:Función grayscale() de CSS

Referencia:Función hue-rotate() de CSS

Referencia:Función invert() de CSS

Referencia:Función opacity() de CSS

Referencia:Función saturate() de CSS

Referencia:Función sepia() de CSS