La función invertir() es una función incorporada que se usa para aplicar un filtro a la imagen para establecer la inversión del color de la imagen de muestra.
Sintaxis:
invert( amount )
Parámetros: esta función acepta una cantidad de parámetro único que contiene la cantidad de conversión. El valor de inversión se establece en términos de valor y porcentaje. El valor 0% representa la imagen original y el 100% representa la imagen invertida. La función invert() utiliza internamente la siguiente fórmula para computar el inverso de la imagen:
amount * (255 - value) + (1 - amount) * value
El valor de la inversión está controlado por la cantidad variable, el valor de la variable se encuentra entre 0 y 1 (flotante) rango (esto se hace convirtiendo el porcentaje pasado de inversión de color a un valor entre 0 y 1). El valor es el valor de color del píxel. (valor 255) da el color después de restar el valor del color con el valor máximo de píxel, asume que el valor del píxel está en el rango de 0 a 255 (aunque el espacio de muestra de la imagen de entrada se puede estirar/escalar para cumplir con los criterios especificados) . A continuación se muestra una tabla que contiene una lista de porcentajes de inversión y el resultado que producen.
| inversión | Resultado |
|---|---|
| 0% | Imagen original |
| 50% | Imagen con cada píxel de color gris. |
| 100% | Imagen completamente invertida |
El siguiente ejemplo ilustra la función CSS invert() en CSS: Ejemplo:
html
<!DOCTYPE html>
<html>
<head>
<title>CSS invert() Function</title>
<style>
h1 {
color:green;
}
body {
text-align:center;
}
.invert_effect {
filter: invert(100%);
}
</style>
</head>
<body>
<h1>GeeksforGeeks</h1>
<h2>CSS invert() function</h2>
<img class="invert_effect" src=
"https://media.geeksforgeeks.org/wp-content/cdn-uploads/20190710102234/download3.png"
alt="GeeksforGeeks logo">
</body>
</html>
Producción:
Navegadores compatibles: los navegadores compatibles con la función invert() se enumeran a continuación:
- Google Chrome
- explorador de Internet
- Firefox
- Safari
- Ópera