• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
0

Retain Overlay effect in illustrator for SVG file

Community Beginner ,
Dec 04, 2020 Dec 04, 2020

Copy link to clipboard

Copied

Hi, I hope someone can help me out.

I have a design that is created in illustrator. It has an overlay effect on it, when I save the file as an SVG file, the overlay shows as white on my background whereas I need it to show as an overlay on any background that it is placed onto. How do I do this?

 

Thanks

Wanda

Views

399

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 guidelines
Community Expert ,
Dec 04, 2020 Dec 04, 2020

Copy link to clipboard

Copied

Please show.

Please do include the Appearance panel.

Please do also show the resulting SVG

Votes

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 guidelines
Community Beginner ,
Dec 05, 2020 Dec 05, 2020

Copy link to clipboard

Copied

Hi Monika

Herewith a screenshot of what I need to achieve.

The other screenshot is of the ai file with the appearance panel as requested.

The flower pattern is white inside a clipping mask, that sits behind the blue lines.

When I save this as a SVG file the pattern comes in white and not overlay when I place it in photoshop as a test.

final result.png

Screenshot 2020-12-05 at 11.26.42.png

Votes

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 guidelines
Community Expert ,
Dec 05, 2020 Dec 05, 2020

Copy link to clipboard

Copied

Not all blend modes are supported in SVG.

Also: whenimporting an SVG, the importing app might ditch things.

 

Do you need the SVG in Photoshop, or what will be the final use?

Votes

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 guidelines
Community Beginner ,
Dec 05, 2020 Dec 05, 2020

Copy link to clipboard

Copied

Hi, the client wants it for their website, but they want it in an SVG format that is easily scalable, so I would imagine illustrator would be better for this application.

Votes

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 guidelines
Community Expert ,
Dec 05, 2020 Dec 05, 2020

Copy link to clipboard

Copied

Then why do you "test" it in Photoshop?

Votes

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 guidelines
Community Beginner ,
Dec 05, 2020 Dec 05, 2020

Copy link to clipboard

Copied

So that I can see if it's creating the effect I need, where should I be testing this?

Votes

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 guidelines
Community Expert ,
Dec 05, 2020 Dec 05, 2020

Copy link to clipboard

Copied

Photoshop maybe interprets an SVG differently than a browser does. You cannot be sure of that.

So you need to set up a test case in HTML and also test it in different browsers.

Votes

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 guidelines
Mentor ,
Dec 05, 2020 Dec 05, 2020

Copy link to clipboard

Copied

I gather that you client does not have Illustrator but only Photoshop? their web master or who ever does their site should have both, I would think. Just curious as to the details of the transition of a file to a client. The old version of transition from one to another app use to be eps- have you tried that one?

 

Monika- you are the master here so please forgive my intrusion but curious as to the reasoning.

Votes

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 guidelines
Community Expert ,
Dec 05, 2020 Dec 05, 2020

Copy link to clipboard

Copied

Good luck with EPS. Since it doesn't support any transparency related thing.

Votes

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 guidelines
Community Beginner ,
Dec 05, 2020 Dec 05, 2020

Copy link to clipboard

Copied

LATEST

Thanks very much I will try this.

Votes

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 guidelines