Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Use sRGB color profile #325

Closed
kasperkamperman opened this issue Jun 24, 2020 · 7 comments · Fixed by #484
Closed

Use sRGB color profile #325

kasperkamperman opened this issue Jun 24, 2020 · 7 comments · Fixed by #484
Labels
bug Something isn't working released

Comments

@kasperkamperman
Copy link

Describe the bug
I'm using a specific purple color: #4f14bc as a background color and in my images (tested both svg and png).
However this color comes out as: #3a1fb1 in PNG
And as #3c1eb0 in JPEG

To Reproduce
npx pwa-asset-generator Demo-Dot.svg ./bug/ --background "#4F14BC" --type png
npx pwa-asset-generator Demo-Dot.png ./bug/ --background "#4F14BC" --type png
npx pwa-asset-generator Demo-Dot.svg ./bug/ --background "#4F14BC" --type jpg
npx pwa-asset-generator Demo-Dot.png ./bug/ --background "#4F14BC" --type jpg

Expected behavior
icons and splash screens ending up with #4F14BC as color if I have used that as input.

I couldn't attach svg directly so I zipped it.

** original **
Demo-Dot.svg.zip
Demo-Dot

** outcome **
manifest-icon-512

manifest-icon-512
@kasperkamperman kasperkamperman added bug Something isn't working needs verification Bug needs to be verified with reproduction labels Jun 24, 2020
@onderceylan
Copy link
Collaborator

Hi @kasperkamperman, thanks for your feedback! pwa-asset-generator doesn't do anything special for the rendering of the colors and the color codes in image output. It's all set by Puppeteer and Chromium based browser itself.

Before digging in, may I ask you to try RGB color value instead, such as --background "rgb(79,20,188)" to see whether it meets your expectations? I also wonder if changing the image type to JPEG would make a difference.

@onderceylan
Copy link
Collaborator

I'm going to close this issue as by default a compression applies to the both image formats and color can change slightly.

@wojtekmaj
Copy link

I think I know where this issue could emerge from. Today I noticed that one of my splash screen renders in a slightly different color. After investigation it appears that one of the images (apple-splash-1125-2436) is being rendered with RGB as opposed to sRGB color profile.

@onderceylan onderceylan reopened this Dec 15, 2020
@onderceylan onderceylan removed the needs verification Bug needs to be verified with reproduction label Dec 15, 2020
@onderceylan onderceylan changed the title color is changed Use sRGB color profile Dec 15, 2020
@onderceylan
Copy link
Collaborator

Hey @wojtekmaj, thanks so much for shedding a light on this issue! There's a chrome flag forcing Chromium to run with sRGB color profile. I'm going to ship a new version with this fix.

onderceylan added a commit that referenced this issue Dec 15, 2020
@onderceylan
fix(main): force enable sRGB color profile
450d233 
There's occasionally a slight color difference between the given color inputs and generated images.
Force enabling sRGB color profile for Chromium should address this issue.

fix #325
@onderceylan onderceylan mentioned this issue Dec 15, 2020
Merged
onderceylan added a commit that referenced this issue Dec 15, 2020
@onderceylan
fix(main): force enable sRGB color profile
15eef1b 
There's occasionally a slight color difference between the given color inputs and generated images.
Force enabling sRGB color profile for Chromium should address this issue.

fix #325
onderceylan pushed a commit that referenced this issue Dec 15, 2020
@semantic-release-bot
chore(release): 4.0.2 [skip ci]
8c4e4ee 
## [4.0.2](v4.0.1...v4.0.2) (2020-12-15)

### Bug Fixes

* **main:** force enable sRGB color profile ([15eef1b](15eef1b)), closes [#325](#325)
@onderceylan
Copy link
Collaborator

🎉 This issue has been resolved in version 4.0.2 🎉

The release is available on:

Your semantic-release bot 📦🚀

@wojtekmaj
Copy link

Just tested it out and can confirm, it works like a charm!

@onderceylan
Copy link
Collaborator

onderceylan commented Dec 16, 2020 •
edited
Loading

Thanks for clarifying the issue, moreover testing and confirming the fix @wojtekmaj! Really helpful.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
bug Something isn't working released
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

fix(main): force enable sRGB color profile elegantapp/pwa-asset-generator
3 participants
@kasperkamperman @onderceylan @wojtekmaj