Highlighted

export png with clipping mask but no transparency

Participant ,
May 09, 2019

Copy link to clipboard

Copied

Hi,

When I export an png -file from illustrator and have a clippingmask that will not work so there is not transparency.

Anyone know if there´s a  way to export png with clipping mask transparency ?

/ Mattias

Most Valuable Participant
Correct answer by Jacob_Bugge | Most Valuable Participant

Mattias,

Are you saying that if you make a Clipping Mask, in the PNG the parts clipped (away) are white or something instead of transparent, or are we talking about an Opacity Mask using grey to get partlal transparency/reduced opacity?

In the former case I believe the parts clipped (away) should indeed become transparent in the PNG, but in the latter case I believe you can copy the knockout path (Group) and give the copy the desired appearance (colour and degree of transparency/opacity) then select the original and the background to knockout from and Pathfinder>Minus front as suggested by John; or you can turn the original black and select it with the background and make an Opacity Mask thereby keeping everything reversible.

Views

1.6K

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

export png with clipping mask but no transparency

Participant ,
May 09, 2019

Copy link to clipboard

Copied

Hi,

When I export an png -file from illustrator and have a clippingmask that will not work so there is not transparency.

Anyone know if there´s a  way to export png with clipping mask transparency ?

/ Mattias

Most Valuable Participant
Correct answer by Jacob_Bugge | Most Valuable Participant

Mattias,

Are you saying that if you make a Clipping Mask, in the PNG the parts clipped (away) are white or something instead of transparent, or are we talking about an Opacity Mask using grey to get partlal transparency/reduced opacity?

In the former case I believe the parts clipped (away) should indeed become transparent in the PNG, but in the latter case I believe you can copy the knockout path (Group) and give the copy the desired appearance (colour and degree of transparency/opacity) then select the original and the background to knockout from and Pathfinder>Minus front as suggested by John; or you can turn the original black and select it with the background and make an Opacity Mask thereby keeping everything reversible.

Views

1.6K

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Community Beginner ,
May 09, 2019

Copy link to clipboard

Copied

I don't think PNG supports clipping paths - only alpha channel transparency.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Adobe Community Professional ,
May 09, 2019

Copy link to clipboard

Copied

Maly_1 has it right; PNG does not support the Illustrator clipping mask. You 'll have to use crop, trim, divide, or whatever applicable functions it takes to destructively clip the contents permanently, then export to PNG. If you post a screenshot of what you're doing, you'll get more specific instructions.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Most Valuable Participant ,
May 09, 2019

Copy link to clipboard

Copied

Mattias,

Are you saying that if you make a Clipping Mask, in the PNG the parts clipped (away) are white or something instead of transparent, or are we talking about an Opacity Mask using grey to get partlal transparency/reduced opacity?

In the former case I believe the parts clipped (away) should indeed become transparent in the PNG, but in the latter case I believe you can copy the knockout path (Group) and give the copy the desired appearance (colour and degree of transparency/opacity) then select the original and the background to knockout from and Pathfinder>Minus front as suggested by John; or you can turn the original black and select it with the background and make an Opacity Mask thereby keeping everything reversible.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Participant ,
May 09, 2019

Copy link to clipboard

Copied

Thank you all fot getting involved in this.

I had to use the pathfinder to make it work. It worked fine. I dont use this kind of export so much but in this case it was a for icon for a software.

best regards
Mattias

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Most Valuable Participant ,
May 10, 2019

Copy link to clipboard

Copied

You are welcome, Mattias.

Was my guess right, that it was a partial transparency, and you had tried with an (Opacity) Mask through the Transform palette?

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Participant ,
May 10, 2019

Copy link to clipboard

Copied

Hi,

I am working on a Swedish version so some times its hard to know the specific names of things.

When ít did not work I only had a clipping mask and the png export did not catch that so I had to remove free that mask and use the patchfinder to cut the object out. I attach the iconimage and you might understand.
this first image is the last cut outtedMG__B_s10.pngand this is how the first png image looked lite.B_s10MG_.png

best regards
Mattias

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Most Valuable Participant ,
May 10, 2019

Copy link to clipboard

Copied

Mattias,

Monika has kindly made this exquisite multilingual page available:

http://vektorgarten.de/illustrator-polyglott.html

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Participant ,
May 10, 2019

Copy link to clipboard

Copied

Thanks a lot. Very good to have that.

/ M

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Most Valuable Participant ,
May 10, 2019

Copy link to clipboard

Copied

Mattias,

Indeed: the Polyglott page is a great help, sometimes even crucial.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Contributor ,
May 10, 2019

Copy link to clipboard

Copied

Hi,

When you use the asset export pallet to export your artwork to PNG, it's useful to check before exporting, if you made the correct export settings. PNG and maintain the transparency.

main transparency.gif

Good luck

Patrick Toebosch

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Participant ,
May 10, 2019

Copy link to clipboard

Copied

I always do that but in this case it did not work.
/Mattias

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Contributor ,
May 10, 2019

Copy link to clipboard

Copied

What is your workflow: you start with Ai then you go to? ID, Word? Can you give me more info?

Thanks.

Patrick

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Participant ,
May 10, 2019

Copy link to clipboard

Copied

This is already solved.
Thanks

I needed to export a png with transparency to be used as a icon in a software.

/ Mattias

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Adobe Community Professional ,
May 10, 2019

Copy link to clipboard

Copied

mattias@gordon.se  wrote

This is already solved.

That's great Mattias, please take a moment and mark it Answered.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...