Open Bug 1431518 Opened 6 years ago Updated 1 month ago

Image "copy to clipboard" produces the wrong colors, due to losing image's color profile

Categories

(Core :: Graphics: Color Management, defect, P3)

defect

Tracking

()

Tracking Status
firefox59 --- affected

People

(Reporter: dholbert, Unassigned)

References

(Blocks 1 open bug)

Details

(Keywords: correctness, Whiteboard: [gfx-noted])

Attachments

(4 files)

(originally reported via Twitter at https://twitter.com/brianloveswords/status/954076018947641345 )

STR:
 1. Download attached image (which I took from 
https://vignette.wikia.nocookie.net/mario/images/f/f6/Question_Block_Art_-_New_Super_Mario_Bros.png )

 2. View the image in Firefox, and right-click the image & choose "Copy Image".

 3. Open an image editor (like Gimp on Linux) and do Ctrl+V to paste.

 4. Separately: open the image file itself (the downloaded PNG) in another window of the same image editor.

 5. Compare the colors in the editor windows in step 3 vs step 4.

EXPECTED RESULTS:
Colors should be the same.

ACTUAL RESULTS:
The colors are fainter in the image that was produced from "Copy Image" + Ctrl V. (Fainter than they look in the other Gimp window, and fainter than 

If I perform the STR in Chrome, I get EXPECTED RESULTS.

(Note: gimp tells me that this image uses the "sRGB IEC61966-2.1" color profile. This is different from plain old "sRGB".  I'm guessing we're losing some color profile data when we copy to clipboard, or something.)
Here's a screenshot showing the difference. I'm using:
Firefox 59.0a1 (2018-01-17) (64-bit)
Chrome 65.0.3322.3 (Official Build) dev (64-bit)
Ubuntu 17.10 (64-bit)

(...with two Dell 24-inch monitors, if the display ends up mattering from a color profile perspective)
Actually... Maybe this is a Chrome bug?

Facts:
 - Firefox & Chrome have the same *rendering* of the original image itself, to my eye.
 - That rendering looks much closer to the pasted Firefox image-data.  (It's fainter than the pasted Chrome data.)

So maybe Firefox is applying the color profile when generating the copypasted image data, and Chrome is not...?
Hmm no, probably a Firefox bug. I'm partly confusing myself because Gimp has a different (darker) rendering that either browser, for the original image, for some reason.

I spun off bug 1431536 for the fact that Firefox & Chrome disagree on the *rendering* of the resulting pasted image data (though they agree on the rendering of the color-profile-tagged source image).
See Also: → 1431536
This is more obviously-broken in a profile where you've set gfx.color_management.mode=1 [and restarted to let that take effect].

In such a profile, the pasted image data doesn't round-trip correctly, if you paste it into e.g. Gimp or Google Slides and view it in Firefox.  (We generate the same pasted output regardless of that pref; but if you have gfx.color_management.mode=1, then the resulting pasted image looks different from the original.)

So -- our behavior right now makes some sense given that gfx.color_management.mode=2 is the default (and the pasted image data round-trips appropriately under that configuration).  But a user might rightfully expect that we should generate different pasted image data if we have gfx.color_management.mode=1, such that the image data still round-trips correctly.
Component: ImageLib → GFX: Color Management
Keywords: correctness
Priority: -- → P3
Whiteboard: [gfx-noted]
I did not see this entry and submitted bug 1517539


I have noticed that GIMP is not very good for testing, as it does not display the ICC profile of the clipboard the way Photoshop and Affinity Photo do. Perhaps my steps can be useful.

Any update with this?
I'm testing it on Figma, Illustrator, Sketch, Photoshop, and basic image editing tools, still produces the wrong colors.

Blocks: 1615397

I'm experiencing this on OSX, but not on Windows.

Typically when I paste the copied image back in Whatsapp web-interface (also FF) I would expect the same colors.

Also on OSX with this issue, Catalina 10.15.16 specifically. I did not have this issue on my old Mac. Whenever I copy an image from Firefox into my clipboard, the image gets lighter in tone and duller in saturation. This does not happen in Safari or whenever I copy an image from any other program. I have my Mac's color profile set to sRGB.
I have changed the settings in about:config related to gfx.color_management to numerous different combinations, even creating a direct link to my Mac's sRGB profile. The issue persists.

I am experiencing similar phenomenon, although in reverse. Uploading images via copy paste into firefox produces an uploaded image with color shift. Uploading the same image via copy paste into chrome produces an uploaded image with correct colors (no color shift). Want to upload images to facebook,, imgur, etc. using copy paste? Don't use firefox!

(In reply to tomdav from comment #12)

I am experiencing similar phenomenon, although in reverse. Uploading images via copy paste into firefox produces an uploaded image with color shift. Uploading the same image via copy paste into chrome produces an uploaded image with correct colors (no color shift). Want to upload images to facebook,, imgur, etc. using copy paste? Don't use firefox!

Have the same bug here: all the images that I copy-paste into my blog using Firefox get much more pinkier and my followers complain about that( Please, fix.

I have the same problem in macOS Big Sur 11.3.1 using Firefox 88.0.1, only happens when copy to clipboard an image or screenshot and pasted in Whatsapp Desktop or another program, please fix it, it's annoying.

This is actually a far more significant bug that I originally realized. It affects anything that touches the canvas API. For example, if you are uploading a file and page uses the canvas API to resize or rotate the image client side before upload, colors will be shfted. The way I fixed it on my computer was to disable color management in firefox.

https://support.mozilla.org/en-US/questions/866855

I can't believe this bug has been around for almost a decade with no fix. In that regard, shouldn't color management be disabled by default until this bug is resolved? So sad that firefox is destroying so many images on the web.

Severity: normal → S3

Firefox 64 bits 110.0.1.

This issue still hasn't been fixed. I see it every day when uploading pictures into my favourite social website from Windows 10's clipboard while using Firefox.

The uploaded image ends up all greyish, i.e. it lost color depth compared to the original picture.

I'm having the same issue on MacOS, both Ventura and Sonoma, and Firefox 118.0.2
Copy-pasting any image from Firefox results in a heavily de-saturated image in image editing software, emails, messaging, and what else.
Disabling the color management in Firefox doesn't fix it. Is there another work-around?

For what it's worth, colors from the clipboard are accurate if you paste into a document in Photoshop that is not color managed.

The problem is that Photoshop's New Document window takes the clipboard's ICC profile into consideration when making a new document and images copied from Firefox show up incorrectly as having a Generic RGB Profile. You can change this on the New Document window under Advanced to Don't Color Manage this Document as a fix, but there's not a way to keep that as a default for every new image. It will always revert to Generic RGB Profile when you have clipboard data from Firefox.

When you paste Firefox clipboard image data into a new document with a Generic RGB Profile, that image's ICC profile and color data are mismatched from Generic RGB and that discrepancy is what's causing incorrect colors. Converting or Preserving colors won't help because the destination space is incorrect. Whether Firefox has thrown out the original profile or has done something with it's handling of the ICC to confuse imaging programs is unknown, but the problem lies with image programs' handling of clipboard color data from Firefox. Even attempting to select the "correct" profile upon creation requires Color Management for that space turned off. Otherwise, It will either run an incorrect conversion or keep the mislabeled clipboard profile.

@butlergames, I would think the clipboard is just a PNG without an embedded ICC profile. It is a screen capture, presumably rendered in the gamut of the display, so there would be an implicit ICC profile, that of the display. I suspect the problem is that FF thinks it needs to convert to some other gamut, or "generic profile" as you say, instead of just leaving it as is. Whatever gamut this is, it leads to flatter images when images are copied from FF, and more saturated images when images are pasted into FF. I have sRGB set for my display gamut, so whatever gamut they are converting to it's flatter than sRGB!

This is a pretty nasty bug and surprised it still hasn't been fixed, somewhat inexcusable. It affects more than just copying/pasting images, it also affects anything that touches the canvas API. This should be a higher priority to fix, but I digress.

My initial workaround to "fix" this issue was to disable color management in FF. This is done by going into about:config and setting gfx.color_management.mode to 0. The upside is images are not color shifted when copying from, or pasting into FF, the canvas API works as it should, and images with sRGB profile display as they should. The downside is images with some other ICC profile don't get color corrected. I decided to play around with various undocumented flags and found a better solution. This only works if your monitor's color gamut is set to sRGB. Go into about:config and set gfx.color_management.force_srgb to true, and gfx.color_management.mode to 2. The former will prevent color shifts when copying/pasting images, and the latter will enable color management for non sRGB images. Unfortunately, if your monitor's color gamut is set to something other than sRGB the former won't work, you will get color shifts when copying from or pasting into FF.

You need to log in before you can comment on or make changes to this bug.

Attachment

General

Created:
Updated:
Size: