Entrar ¿Aún no tienes acceso?
Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
Solucionado (ver solución)
Solucionado
(ver solución)
1
respuesta

[Duda] duda respecto al color de los iconos

Referente al curso React: Utilizando Styled Components, en el capítulo Temas y actividad Íconos en tema negro

por Henry Alexander Agustín Pérez
| 77.7k xp | 1 posts

Hay algo que me deja dudas y es respecto a la propiedad del objeto "temaOscuro"

export const temaOscuro = {
    body: fondoOscuro,
    inside: contenidoOscuro,
    text: textoFondoOscuro,
    filter: "invert(100%)",
}

En este caso me imagino que invert(100%) funciona por el hecho de que son colores opuestos, me refiero a pasar de blanco a negro y viceversa pero si en el caso que los colores que yo estaria utilizando serian diferentes a estos, como se haria ahi? Estoy algo confundido con esto. Gracias de antemano.

1 respuesta
solución!
por Marianna Costa
| 614.8k xp | 1826 posts
Alura Scuba Team Scuba Team Front-end

¡Hola Henry!

Entiendo tu duda. La propiedad "filter" que estás utilizando en el objeto "temaOscuro" es una propiedad de CSS que se utiliza para aplicar efectos visuales a elementos HTML. En este caso, "invert(100%)" invierte los colores de los elementos a los que se aplica, es decir, convierte los colores claros en oscuros y viceversa.

Si los colores que estás utilizando no son blanco y negro, "invert(100%)" no funcionaría para invertir los colores. En ese caso, podrías utilizar una herramienta como Adobe Color para encontrar los colores complementarios de los que estás utilizando y aplicarlos en la propiedad "filter" para lograr el efecto deseado.

Espero que esto te haya ayudado a aclarar tu duda. Si tienes alguna otra pregunta, no dudes en preguntar. ¡Espero haber ayudado y buenos estudios!

Si este post te ayudó, por favor, marca como solucionado ✓. Continúa con tus estudios!