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

Now import SVG in InDesign !

Nov 05, 2019 Nov 05, 2019

Copy link to clipboard

Copied

Here’s one of the most requested features for InDesign! 

 

InDesign now lets you import the SVG and SVGZ format files in InDesign and InCopy documents. Earlier, SVGs from CC libraries were imported as PNGs in InDesign. 

 

 SVG.png

Place the SVG file 

  • To place the SVG file saved on your computer, choose File Place. 
  • To place the SVG available in your CC Libraries, choose File Place from CC Libraries. 

 

Check this help article for complete details about this feature.

 

Feedback and questions:  

Reply to this post to share your feedback on this feature, and any questions you have around using it. Our team of experts here will do their best to assist you. 

TOPICS
How to

Views

2.5K

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
New Here ,
Nov 06, 2019 Nov 06, 2019

Copy link to clipboard

Copied

I was very excited about this but it doesn't work for me. I have the latest version of InDesign and when I choose File, Place all I get is a pixeled mess. Any suggestions?

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 ,
Nov 06, 2019 Nov 06, 2019

Copy link to clipboard

Copied

Perhaps you forgot to enable "High Quality Display".

It's still a graphic file, and like all other formats, having huge images display in their original quality may will slow down your system.

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
New Here ,
Nov 06, 2019 Nov 06, 2019

Copy link to clipboard

Copied

You were correct. I had forgotten to view as high quality display. However, I didn't immediately think of this as I was under the impression that the placed SVG files would be editable. Can anyone confirm if SVG files placed in InDesign are intended to be editable or not? If not, this function is of no help to me as I work a lot with icons and need to edit the colour. My initial excitement was thinking I could do everything in InDesign and leave out the Illustrator part.

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
Guru ,
Dec 04, 2019 Dec 04, 2019

Copy link to clipboard

Copied

Hi Bromiley,

 

If by editable, you mean the paths can be manipulated in InDesign, then no, SVG files are not editable in InDesign.

 

But you can still place the SVG and use "Edit With" to open the SVG in AI, edit it, and then save the SVG file. Basically, any art inside a graphic frame can only be edited by the graphic program that created it.

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 04, 2019 Dec 04, 2019

Copy link to clipboard

Copied

Hi Bromiley,

 

since an SVG file is readable code you could open the file in a text editor and edit it there.

 

Did just that to correct some of my test SVG files from Adobe Illustrator where the viewPort property in the code was ignored. InDesign was placing the whole graphic visible instead the parts of the graphic that were on the artboard, only.

 

And I also have to add code to every SVG from Illustrator so that InDesign would not add an extra of 0.5 Pt to every edge of the placed graphic.

 

Regards,
Uwe Laubender

( ACP )

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 ,
Nov 06, 2019 Nov 06, 2019

Copy link to clipboard

Copied

Thank you for asking, Om.

Think, I discovered a bug when working with SVG files saved from Adobe Illustrator.

Also reported this at Prerelease some months ago.

 

Illustrator is using viewBox entries. But InDesign will ignore them:

viewBox="0 0 100 100"

 

Instead it seems that the placing mechanism calculates the size of all elements. And here comes the bug:

And it adds always 0.5 Pt on every edge of the placed contents.

 

One can correct that, but this means that every SVG file from Adobe Illustrator has to be edited before being placed.

Just a sample code of an SVG below so everyone can test this.

 

Not edited SVG code from Adobe Illustrator:

<svg id="Ebene_1" data-name="Ebene 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><defs><style>.cls-1{fill:#e5007d;}.cls-2{fill:#ffed00;}</style></defs><title>284x284pt-Rectangle-Artboard-100x100pt</title><rect class="cls-1" x="-92" y="-92" width="284" height="284"/><rect class="cls-2" width="100" height="100"/></svg>

 

Edited SVG code to make the initial viewBox values work as expected:

<svg id="Ebene_1" data-name="Ebene 1" xmlns="http://www.w3.org/2000/svg" width="100" height="100"><defs><style>.cls-1{fill:#e5007d;}.cls-2{fill:#ffed00;}</style></defs><title>284x284pt-Rectangle-Artboard-100x100pt</title><rect class="cls-1" x="-92" y="-92" width="284" height="284"/><rect class="cls-2" width="100" height="100"/></svg>

 

Hope, this issue will be resolved in the next bugfix round for InDesign.

 

Thanks,
Uwe Laubender

( ACP )

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
Nov 07, 2019 Nov 07, 2019

Copy link to clipboard

Copied

Thanks for sharing the detailed information Uwe. I'll make sure it reaches to the team. I'll keep you posted about the update.

 

-Om

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
Guru ,
Dec 04, 2019 Dec 04, 2019

Copy link to clipboard

Copied

Om,

 

I just discovered that in addition to adding extra space to SVG files, InDesign is also cutting off parts of the art with an incorrect Crop Box. I have seen this with files from The Noun Project. I described the effect in this post:

 

https://community.adobe.com/t5/indesign/svg-imported-with-wrong-content-frame/m-p/10779910#M166731

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
New Here ,
Nov 06, 2019 Nov 06, 2019

Copy link to clipboard

Copied

Good to hear that svg files can be placed in Indesign. Though, a bit dissapointed as it seems they will loose interactivity when exported to pdf. I use SolidWorks Composer to create svg:s with hotspots and BOMs but it seems this doesn't work when exported to pdf. Exporting to html seem to work but pdf would be better. Any ideas?

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 ,
Nov 06, 2019 Nov 06, 2019

Copy link to clipboard

Copied

Because the PDF format does not support everything that the SVG format supports.

 

Adobe can add all kinds of functionality to InDesign (multiplayer options! Facebook farms! Tetris!) but that does not automatically mean it will work the same way "in a PDF" (quoted, because even the mere classification "this will work in a PDF" needs additional footnotes detailing which features will work on what OS and in what local PDF viewer).

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 ,
Nov 06, 2019 Nov 06, 2019

Copy link to clipboard

Copied

It is amazing how many people think that Adobe controls the PDF format and can magically make it do whatever they want.

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 04, 2019 Dec 04, 2019

Copy link to clipboard

Copied

As Bob correctly points out, the PDF format is no longer Adobe's. It's now institutionalized into the world of standards organizations, where things c..h..a,.n..g..e.....v..e..r..y.....s..l..o..w..l..y!

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 04, 2019 Dec 04, 2019

Copy link to clipboard

Copied

Of course, even back when Adobe did have the final say on everything related to PDF and kept their own reader up to date with the latest developments, they had no control at all over 3rd party viewers.

Back then Adobe controlled the PDF format but that did not magically make transparency work in Apple Preview.

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 ,
Jun 04, 2021 Jun 04, 2021

Copy link to clipboard

Copied

LATEST

Thanks to Daniel who posted in a thread today the issue I have with viewBox is resolved.

Or at least there is a workaround. The thing I did by editing the SVG code and adding width and height before viewBox is done when you export to SVG with Illustrator and option "Responsive" is unchecked ( which in not the default ) :

AI-Export-SVG-Responsive-UnChecked.PNG

 

Important note:

When you come accross an SVG from Illustrator where width and height before viewBox is missing, do not open the SVG in Illustrator and save again. SVG is an endformat! In this case edit the SVG file with your text editor.

Only if you still have the Adobe Illustrator file, open the AI file and save with option "Responsive" unchecked.

 

More details here:

https://community.adobe.com/t5/indesign/help-with-placing-svg-exported-from-illustrator/m-p/12090681...

 

Regards,
Uwe Laubender

( ACP )

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