0

I'm trying to see if there's a quick and dirty way to export Adobe Illustrator files as SVGS that use the web font names on my company's website instead of the system font names on my machine. Is there a basis script that can do this?

Thanks.

  • 2
    What web-font names? If you're using fonts with @font-face you can give them any name you like for example, the name has nothing to do with the actual font itself. – Cai Jun 28 '17 at 19:52
  • I'm making SVGs for a website that has their css styles pre-defined. I need to match my font-families in the SVGs to their sheets. – Learning stats by example Jul 2 '17 at 13:48
0

As mentioned by Cai, you can define the css font-name to anything you like.

font-family Specifies a name that will be used as the font face value for font properties. MDN - @font-face

If the design you are integrating with references a font called MagicalFont it might be defined as

@font-face {
  font-family: MagicalFont;
  src: url(MagicalFont.ttf);
}

To update this to use your new illustrator font you can simply change the path reference to the font file.

@font-face {
  font-family: MagicalFont;
  src: url('Magical Illustrator Font.ttf');
}

The CSS will still function, anything defined to use font-family: MagicalFont will now be updated to the new font.

| improve this answer | |
  • I can't do this. I can't alter the css sheets on the page, only add SVGs to the page, exported from AI. – Learning stats by example Jul 5 '17 at 16:46
  • @incodeveritas You wont need to alter the css. If you update the font file. I'm confused what you're trying to do. Update a font-file or export an svg that uses a web font? – Lex Jul 5 '17 at 23:02
  • The font-file is a css file, no? I can't change any css on the page. – Learning stats by example Jul 6 '17 at 1:05

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.