Strange Transparency Issues

[Sarcastic-Robot]

Describe the bug Paperize is processing transparency strangely. With Transparent PNGs the transparency displays correct, but seems to cause a strange isometric shift happen to the rest vector image's coloring. With Transparent GIFs the transparency is replaced by a green color. Not sure if this is just a problem in Edge or all browsers.

To Reproduce

1. Make an image layer with a transparent GIF or PNG
2. The problem should display in the preview window
3. Print the component, the error should have also been printed to the PDF

Expected behavior Transparent parts of GIFs should display as transparent. Colored parts of PNGs should display correctly instead of being isometrically shifted.

Screenshots

Additional context Trying to make a Hex image that I can print with a transparent background. This is to make it truly a hex for digital games (not a hex with a white rectangle surrounding it).

Workaround Used a one color PNG instead where the border was not stroked. An acceptable solution, but I would like to have a stroked edge for further separation of Hexes that are side by side.

[Sarcastic-Robot]

Just realized I had some details to add. I have another game that displays icons with a transparent background correctly.... maybe this problem is specific to my images?

[lorennorman]

Just took a look, and I was trivially able to confirm this in:

• in gifs but not in pngs
• with scaling mode set to fit or stretch, but not fill

Can you take a look at your projects and see if this is what you're seeing as well?

[Sarcastic-Robot]

Confirmed. This issue disappears for both the PNGs and GIFs when the scaling mode is changed to fill. It remains however if you change the image back to Fit or Stretch. I'm guessing it's essentially a problem with scaling and it either:

• Redrawing the Transparent pixels incorrectly (GIF problem)
• Redrawing the vector based coloring of the shape (PNG problem)

As a side note on my other project which uses transparent PNGs for icons I'm not having this problem in any of the scaling modes. Not sure what the difference is honestly.

[lorennorman]

So you ARE seeing this issue with PNGs? I was unable to reproduce with the PNG I threw together in Gimp, I will double-check my method.

If you have a PNG that'll do this, would you mind sharing it? I will also test loading it up and re-exporting to see if it goes away.

This is such a weird one, that weirdly-tilted hex grid in your image is freaking me out a little!

[lorennorman]

oh wait you're saying it's not transparency that does it in PNG but the colored parts? I think i'm not fully understanding this issue yet. Or... maybe it is two separate issues!

[Sarcastic-Robot]

This is the PNG Isometric Distortion to the coloring of the main image issue mentioned in the OP:

Screenshots:

This is the PNG used mentioned in the second post:

maybe this problem is specific to my images?

They are very different problems but I assumed they were related because they both involved transparency, I think we can confirm there is some link because they have the same trigger (scaling mode set to stretch or fit).