Since Safari 14 will finally support WebP images, I wanted to start using them in my tutorials and guides.
I was able to enable WebP uploads in WordPress, but what about Photoshop? It’s annoying to keep using conversion tools all the time.
Luckily, there’s a quick and simple solution that allows you to open and save WebP images in Photoshop!
How to Enable WebP in Photoshop with Google’s WebPShop Plugin
The peeps at Google have created a nice and simple plugin for Photoshop, called WebPShop, which allows you to enable the WebP format.
Here’s what you need to do.
Step 1 – Download the WebPShop plugin from GitHub
Go to the GitHub repository, click on the Code button, and select Download ZIP.
Step 2 – Add the file in Photoshop
For Windows users
Unzip the archive and copy the
WebPShop.8bi file, currently found in the
Now, you need to paste that file in your Photoshop installation folder, in the Plug-ins subfolder.
Usually, the folder’s default path is:
C:\Program Files\Adobe\Adobe Photoshop\Plug-ins
For Mac users
I don’t have screenshots for you because I don’t own a Mac. 🙁
Unzip the archive and copy the
WebPShop.plugin file, currently found in the
Then, you need to paste that file in your Photoshop installation folder, in the Plug-ins subfolder.
I think that the default path is:
Fix for possible error
If you get this error on macOS 10.15+ …
“WebPShop.plugin cannot be opened because the developer cannot be verified.“
… run this code in your Terminal, in Finder > Applications > Utilities:
sudo xattr -r -d com.apple.quarantine "/Applications/Adobe Photoshop 2020/Plug-ins/WebPShop.plugin"
The path could differ, depending on where you have Photoshop installed, or the name of the folder(s).
Step 3 – Restart Photoshop
If Photoshop was open when you did this, restart it.
Now, you should be able to open and save WebP images.
How to Save Images as WebP in Photoshop
In most cases, you would use the Export > Save for web feature to save images.
That won’t work because you won’t have the WebP format available there.
Instead, you’ll have to use the Save or Save as feature to save WebP images in Photoshop. You’ll find the format at the bottom.
After you click Save, a settings panel will appear, where you can compress the images and stuff. You also have a Preview, which is very useful.
Careful! Resulting WebP Images Can Be Larger Than PNGs or JPGs
Normally, I export my screenshots as PNG-8, which looks the same as PNG-24, but the size is a lot smaller.
I thought that by using WebP instead of PNG-8, the size of the images would be even smaller.
But, to my surprise, they weren’t! They were larger unless I used a quality lower than 98, which made them too blurry.
Maybe this is because, most of the time, I scale down the images, which changes the pixelation. I think that’s one of the cases when the resulting WebP image becomes larger.
That’s probably why they don’t use WebP images on their own blog, which is pretty weird, since they invented and promote it. 🙂
So, be careful! Check the size of your WebP images to see if they became larger instead of smaller.
That’s a Wrap
I hope you found the guide useful and comprehensive!
If you have questions or thoughts, please leave a comment or send me a message using the contact page.