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

How can I export an SVG with both RGB and CMYK colors?

New Here ,
Apr 14, 2014 Apr 14, 2014

Copy link to clipboard

Copied

I'm trying to make a workflow for Illustrator (CMYK) to Web (SVG with CMYK colors and RGB fallbacks) to Print (CMYK PDF) using SVG. However, it looks like Illustrator only exports RGB colors in SVG files. Illustrator would only be responsible for the saving as SVG, then I'd use other tools to do the rest.

Is there a way to get Illustrator to export device-cmyk() or icc-color() values in addition to RGB colors in an SVG file? Is there a way to export spot color names as well?

Thanks!

Views

27.2K

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
Adobe
Community Expert ,
Apr 14, 2014 Apr 14, 2014

Copy link to clipboard

Copied

Is there a way to get Illustrator to export device-cmyk() or icc-color() values in addition to RGB colors in an SVG file?

SVG files store HEX color values.

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 ,
Apr 14, 2014 Apr 14, 2014

Copy link to clipboard

Copied

Hi Monika,

The hex values are RGB colors. I'm looking for a way to get CMYK colors exported in addition to the RGB colors so that I can get the print colors correct when converting my SVG back to PDF later in my workflow.

Here's an example:

<color-profile name="acmecmyk" xlink:href="http://printers.example.com/acmecorp/model1234"/>

<circle fill="#CD853F icc-color(acmecmyk, 0.11, 0.48, 0.83, 0.00)"/>

See http://www.w3.org/TR/SVGColor12/#icc-colors for more info on icc-color(). device-cmyk() is another possibility.

I suspect that Illustrator may not support either of these but I wanted to verify. If it doesn't, any ideas for other workarounds? The assumption is that Illustrator will not be involved after the file is exported to SVG which is why it's important to get the CMYK equivalents exported with the RGB colors during the initial export to 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
LEGEND ,
Apr 14, 2014 Apr 14, 2014

Copy link to clipboard

Copied

Alternate color models will be supported in SVG 2, but since it is an unfinished draft at the moment nobody really uses it and so does AI. You want something that doesn't exist, though I'm sure some preliminary implementations exist e.g. in some development branch of Inkscape. Eitehr way, at this point it's totally pointless to waste a second thought on this. Unless it becomes an official standard, Adobe won't support it in their apps. For now you can only create your own implementation with custom user data sections and referenced color profiles. Beyond that you have things backwards - nobody and really nobody on teh web cares for CMYK. Even if the spec were already final, anyone with brains would still convert the colors on the local calibrated system to a) ensure correct color rendering and b) keep file sizes as small as possible. Even if browsers may support it, they wil lonly use generic profiles to render CMYK or Lab. Yor idea is seriously flawed therefore. What you want would be like having a custom high-gammut profile in AI and then using a standard FOGRA profile for printing - the colros will simply be wrong.

Mylenium

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 ,
Apr 14, 2014 Apr 14, 2014

Copy link to clipboard

Copied

Hi Mylenium,

Thanks for the feedback. You're right that unmanaged device colors, device-cmyk() doesn't appear until SVG2 (http://www.w3.org/TR/SVG2/color.html#device). Sorry if that was misleading. My other example however, icc-color(), is part of SVG 1.1 but the SVG 1.2 docs are a litte more detailed (http://www.w3.org/TR/SVGColor12/#icc-colors). I agree, that Adobe wouldn't necessarily support a draft specification, but there exist some ways to do this within SVG 1.1. Here's a quote about icc-colors from that last link:

As with SVG Full 1.1, SVG Color content may specify color using an ICC profile (see [ICC42]); an sRGB fallback must still be provided.

As for the intent, let me clairfy. I'd want to use an RGB fallback for display on the web since RGB is used by monitors of course. However, I will eventually convert the resulting SVG to a PDF for print and in that case I'll need the CMYK values since it's impossible convert from CMYK to RGB and back to CMYK. The reason I can't export straight to PDF in the first place is that I'll allow users to manipulate the SVG in their browser before printing.

Let's sssume I have all the other details worked out such as how to force the browser to ignore the icc-color so it always uses the fallback for consistency; I still need to figure out how to maintain the CMYK colors or get a mapping of RGB to CMYK colors for all colors in the document. I'm thinking that creating a mapping for each document might be the solution here, but I'm still brainstorming the best way to do that as well.

Any other ideas?

Thank you

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 ,
Aug 24, 2014 Aug 24, 2014

Copy link to clipboard

Copied

Hi, any news on this topic Mylenium, @jon__wu ?

What we need is to be able to export a svg file from illustrator, modify it in our web application and then get it back to print with its original cmyk colors.
If Illustrator stored the cmyk info in svg it would be great.. but maybe there is another workaround for this?

thanks, dadanas

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 ,
Aug 24, 2014 Aug 24, 2014

Copy link to clipboard

Copied

No, that's not possible.

When converting between CMYK and RGB Illustrator uses ICC profiles so there won't be any converting back to anything that existed. It's always a new conversion.

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 ,
Aug 24, 2014 Aug 24, 2014

Copy link to clipboard

Copied

ok.

Do you think there is any way to create a cmyk file (any format), then edit it in the web environment and convert it back to cmyk pdf for printing (the printer accepts only cmyk pdf files?

A real world scenario is as following:
1) make a design with some variable fields (let's say it's a t-shirt design)
2) show it in a web app, where user can edit previously defined text fields (but no colors, no fixed text, no images)
3) get the modified file back to a cmyk pdf to print.

thanks! best
dan

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 ,
Aug 24, 2014 Aug 24, 2014

Copy link to clipboard

Copied

Depends on what the web environment is capable. Maybe you could get it to work in CMYK?

The trouble is not that it isn't possible, but to get the same CMYK values again after converting to RGB and then to CMYK again.

Maybe you should read up on color management.

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 ,
Aug 24, 2014 Aug 24, 2014

Copy link to clipboard

Copied

Maybe I could get it to work in CMYK, but it it appears that the svg file exported by Illustrator doesn't contain the cmyk information.
From what we tested it seems that we need to export it to svg in order to be able to edit in in a web environment effectively.

On the other hand, I have noticed that the svg file produced by Illustrator contains some encoded information, which Illustrator uses when the file is opened.
Is there any info about how to decode that information?
This could be useful, because it contains all the correct cmyk colors and Illustrator gives priority to this encoded data over the svg itself (so if you edit the svg file, and then reopen it for edition in Illustrator, the program ignores the svg data and uses its encoded info).

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 ,
Aug 24, 2014 Aug 24, 2014

Copy link to clipboard

Copied

No that couldn't be useful. It only gets you in deeper trouble.

Illustrator saves two forks in a file: an SVG fork that is used if the file is opened or displaxed in some SVG editor and an AI fork that is used only in Illustrator. If you edit the SVG fork, you won't update the AI fork and you get a nightmare of a file, that contains two different versions of the contents. When you open it in Illustrator again and save it, the CVG edits are lost. Illustrator just doesn't take notice of them.

The SVG part of the file will always be RGB. Then AI part of the file might also be CMYK. Illustrator cannot save CMYK SVG (which would be possible with some trickery, but not inside Illustrator).

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 ,
Aug 24, 2014 Aug 24, 2014

Copy link to clipboard

Copied

That's why I was asking if it's possible to parse/edit AI fork outside illustrator. Do you know if it's possible?

(btw. thanks a lot for your responses!)

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 ,
Aug 24, 2014 Aug 24, 2014

Copy link to clipboard

Copied

The only software that can somewhat open AI files besides Illustrator is CorelDraw X5 (and higher).

Try EPS instead. There are quite some software packages that can edit EPS.

What are you trying to do actually? Writing software to edit an AI file? Setting up a t-shirt shop?

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 ,
Aug 24, 2014 Aug 24, 2014

Copy link to clipboard

Copied

hmm, maybe eps is the answer, I will research this. thanks!

basically what I need is to create a cmyk template, edit it on the web and get it back to printing.
I don't mind if colors are not exact when shown on the web (cmyk to rgb conversion) but the edited template must have the same cmyk colors as the original one.

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 ,
Aug 25, 2014 Aug 25, 2014

Copy link to clipboard

Copied

Our solution was to write a custom script to create a mapping of all RGB

colors to CMYK colors in the document (ideally per element). Then, after

the SVG is saved, you can inject the cmyk values into the SVG.

It's not the cleanest, but it works! It's of course much better than trying

to run some post process conversion because you get the actual conversions

that Illustrator would have used with all the relevant settings and

profiles.

On Sun, Aug 24, 2014 at 7:47 AM, Adobe Forums <forums_noreply@adobe.com>

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 ,
Aug 25, 2014 Aug 25, 2014

Copy link to clipboard

Copied

Jon_wu, thanks, this is something I was thinking about, when I learned that Illustrator has support for external scripts...

would it be a problem for you to share the script you're using? this would be of a great help...

also, do you do the reverse svg -> pdf conversion? I think, that in our tests illustrator ignored cmyk profiles in svg on import.
I think we ended up using scribus/inkscape for this, but sometimes the colors were not correct.

best, dan

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 ,
Aug 25, 2014 Aug 25, 2014

Copy link to clipboard

Copied

Hi Dan,

Sorry, I can't share the script as it's part of a large system, but the

basic concept should be fairly straightforward. In the simplest form, just

iterate over every element and create a map of RGB to CMYK colors. It's

possible there could be some overlaps where 2 CMYK values mapped to a

single RGB color (I'm not sure yet). If this was the case, you could store

maps by element ID probably but I haven't tested this.

I'm not concerned about importing back into Illustrator, but I think you're

right in that it won't pull in the CMYK values. Maybe the file won't even

open - I forget.

I end up moving into Apache Batik to eventually convert to PDF, but that

has its own challenges too because Batik's stable code doesn't support CMYK

either.

Hope that helps,

Jon

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 ,
Aug 25, 2014 Aug 25, 2014

Copy link to clipboard

Copied

ok, thanks anyway.

yes, we use batik-rasterizer too, but unfortunately the colors are still messed up sometimes.
But I will keep on researching. thanks for the hints!

dan

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 ,
Aug 25, 2014 Aug 25, 2014

Copy link to clipboard

Copied

Cool let me know if you have any more questions and if you find any useful

tips, I'd love to hear too! I've only completed a proof of concept and this

isn't part of my normal workflow yet so there's still a lot to be done. For

Batik, make sure to check out the svgcolor12 branch if you haven't already.

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 ,
Aug 25, 2014 Aug 25, 2014

Copy link to clipboard

Copied

hi, ok, thanks, I will let you know if something new comes up. on the other hand we'll probably open source the code...

right now we have a working solution in production already, but it's far from perfect - requires quite a lot of manual labor - and I was just checking if something new came up to improve it.
anyway - illustrator scripting might be a partial solution going pdf->svg; I will check the batik branch you mentioned, in case there is something new for the other (svg->pdf) direction.

there is some useful info about cmyk here: CMYK Notes

thanks for your help!
dan

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 ,
Aug 25, 2014 Aug 25, 2014

Copy link to clipboard

Copied

Thanks for the notes. Batik won't recognize the cmyk colors without the

svgcolor12 branch code. With that, I've tested an SVG with the CMYK colors

and it rasterizes to PNG and PDF fine in my tests. Once I open the

resulting PDF in Illustrator, I see the expected CMYK colors - just as they

were originally.

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 ,
Aug 26, 2014 Aug 26, 2014

Copy link to clipboard

Copied

hi, ok, do you have some binaries for this branch of batik-rasterizer, you could share?

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 ,
Aug 26, 2014 Aug 26, 2014

Copy link to clipboard

Copied

Download the svgcolor12 branch source and use the all-jar ant target. The

other targets won't work. See the last post here:

http://batik.2283329.n4.nabble.com/How-can-I-change-the-color-model-of-an-SVG-image-from-RGB-to-CMYK-and-vice-versa-td3092769.html

.

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 ,
Aug 26, 2014 Aug 26, 2014

Copy link to clipboard

Copied

thanks, I will try. best!

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 ,
Sep 22, 2014 Sep 22, 2014

Copy link to clipboard

Copied

Hi Jon_wu, I have downloaded and batik from the svgcolor12 branch and compiled it with all-jar. But I am not sure how to execute it..
as they said in another thread - java -jar doens't work (It complains about missing class Exception in thread "main" java.lang.NoClassDefFoundError: org/apache/xmlgraphics/java2d/color/NamedColorSpace)

would you please show me some working example of the command you're using

thanks in advance
dan

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