Drop shadow for PNG image in CSS

by

Yes, it is possible using filter: dropShadow(x y blur? spread? color?), either in CSS or inline:

img {
  width: 150px;
  -webkit-filter: drop-shadow(5px 5px 5px #222);
  filter: drop-shadow(5px 5px 5px #222);
}
<img src="https://cdn.freebiesupply.com/logos/large/2x/stackoverflow-com-logo-png-transparent.png">

<img src="https://cdn.freebiesupply.com/logos/large/2x/stackoverflow-com-logo-png-transparent.png" style="-webkit-filter: drop-shadow(5px 5px 5px #222); filter: drop-shadow(5px 5px 5px #222);">

More Related Contents:

  1. Center multiple images horizontally in CSS
  2. Browser can’t access/find relative resources like CSS, images and links when calling a Servlet which forwards to a JSP
  3. SVG data image not working as a background-image in a pseudo element
  4. Change color of PNG image via CSS?
  5. CSS Image size, how to fill, but not stretch?
  6. CSS transition effect makes image blurry / moves image 1px, in Chrome?
  7. How to vertically align an image inside a div
  8. Is there any way to hover over one element and affect a different element? [duplicate]
  9. How can I resize an image dynamically with CSS as the browser width/height changes?
  10. Text on image mouseover?
  11. html, css – weird invisible margin below pictures
  12. Greyscale Background Css Images
  13. Replacing H1 text with a logo image: best method for SEO and accessibility?
  14. How to put an image in div with CSS?
  15. CSS: 100% width or height while keeping aspect ratio?
  16. Responsive Images with CSS
  17. CSS opacity and child elements
  18. How to replace color of PNG image using CSS? [duplicate]
  19. How to Include CSS style when converting svg to png
  20. Removing the image border in Chrome/IE9
  21. Transparent hollow or cut out shape in HTML
  22. Define an ‘s src attribute in CSS [duplicate]
  23. Can I do knock-out/punch-through transparency with CSS fonts?
  24. vertical-align image in div [duplicate]
  25. How to vertically align an image inside a div
  26. How to use images in css with Webpack
  27. CSS Border on PNG image with transparent parts
  28. Firefox blurs an image when scaled through external CSS or inline style.
  29. input type=”image” shows unwanted border in Chrome and broken link in IE7
  30. Print styles: How to ensure image doesn’t span a page break

Leave a Comment