Copy link to clipboard
Copied
I have used Photoshop and Illustrator to make a picture to be used as a web icon for my Wordpress site. I have done this several times before with no problem, however, this time the web icon is shown with a black box behind it despite the background being transparent.
This black box is only shown in Safari on Mac (on multiple computers), not Chrome, Safari on iPhone, or Finder. I have tried using PNG and SVG format, same problem. I tried to upload a different picture (created with PS and AI as well) with transparent background and that showed up just as it should, no black box behind it, which leads me to believe the problem is with the specific file and not with my website or Safari. However I can't figure out what is different about this file than the previous ones I've used.
Does anyone have an idea why this is and how I can make the picture show without a black box behind it?
Copy link to clipboard
Copied
Without an actual screenshot of the file in PS as well as on the WP media gallery backend with all the info shown we can't tell you much. The most likely cause could be issues with wrong color profiles still being attached to the file, so that would be the first thing to check.
Mylenium
Copy link to clipboard
Copied
Thanks for replying. Here are screenshots of the file opened in Photoshop as well as the code from the Wordpress Media Gallery - hope this is what you meant, please let me know if I misinterpreted.
The color profile used is sRGB - specifically sRGB IEC61966-2.1. I noticed, though, the Destination Space was set to CMYK, so I changed this to sRBG as well. However, still same issue.
Copy link to clipboard
Copied
Do the different creations show the same behaviour with your current browser? What happens if you exchange your icon with one you know that it works in WordPress?
Copy link to clipboard
Copied
Thanks for replying. No, only this specific creation shows the black box. If I exchange it, it shows a transparent background just as it's supposed to.
I tried to use the file that works as a base and just pasted the other drawing as another layer on top of it - then there was a black box in the browser again.