El día de hoy, trabajando en una web requería hacer un efecto de sombra sobre una imagen, como era PNG, es decir que tenía transparencia y no un fondo blanco, se me ocurrió hacerlo con CSS agregando un box-shadow, pero me tope con el detalle que no era lo que quería.
CSS no me respetaba la transparencia, es decir, sólo quería que la sombra aparecía alrededor del circulo, pero me formaba un cuadrado y se veía un fondo blanco, la imagen se mostraba cuadrada, por lo que no me funcionaba.
Investigando encontré que existe filter: drop-shadow, este filtro si me va a respetar la transparecia y le dará el efecto deseado, quedando así:
Le comparto el código:
1 | filter: drop-shadow(-2px 2px 15px rgba(0, 0, 0, 0.7)); |
Espero les sea de utilidad xD
Me ha servido de mucho, muchas gracias Osvaldo!
Excelente noticia, un gusto poder aportar algo 😀
Gracias por el dato me sirvio muchisimo.
Muchas pero muchas gracias Osvaldo…me a servido muchísimo.!! Te cuento que ni siquiera ChatGPT me pudo dar una solución.
Un gusto poder ayudar 😀