Updated on January 24, 2023 in #dev-environment

Quickly Check If a Google Image Is Really Transparent or Not

No longer get tricked by fake PNG files that have checker box patterns as their background when searching for a transparent image.

Remember that time when you were doing a Google image search looking for a transparent logo or object? You found the perfect one:

• You see that it’s a png
• It has the usual transparent checker box pattern
• It’s not copyrighted
• There’s no watermarks
• It’s high resolution

So you happily download it and open it in your image editor to find that while it’s a png it’s really not transparent. You’re greeted by a literal checker box pattern as its background and your image editing tool’s magic wand isn’t sophisticated enough to remove it without making the image have a bunch of jagged edges. It’s ruined.

Your world is crushed as you continue your quest to find an alternative image. This process repeats itself half a dozen times and eventually you find something.

# The Method

This specifically applies to using Chrome because not all browsers support it. I tested it with Firefox where it didn’t work and someone mentioned it didn’t work with Brave, but it may work with others. Let us know in the comments.

Also, it’s specific to Google’s image search. DuckDuckGo has a “transparent type” filter that works quite well so this method isn’t needed. In my opinion it’s needed for Google because their transparent filter is less accurate, a large percentage of images that it says are transparent aren’t.

1. Visit https://images.google.com
2. Search for something you’re interested in such as: lamps png
3. Click into a specific image so you see the preview of it on the side
4. Start dragging the image anywhere but don’t drop it
5. Notice the background of the image

If the background is transparent (invisible) then you’ve found a real transparent image. You can copy the image and paste it into your image editor to confirm. You’re done!

If the background shows up such as either a literal checker box pattern or whatever background color the image is then it’s not transparent and you can move on.

The video below demonstrates this method.

# Demo Video

Timestamps

• 0:19 – Is this really transparent?
• 0:31 – Dragging the preview of the image to detect if it’s transparent
• 1:34 – Trying it out on a few other images
• 2:37 – Google’s transparent filter isn’t very accurate
• 3:17 – DuckDuckGo is a bit better for filtering transparency
• 3:50 – A browser extension would be pretty sweet

Reference Links

• https://twitter.com/nickjanetakis/status/1545876124865101826

Do you know of a better way to detect this? Let me know below!