: Typekit font in SVG icon I am trying to achieve my logo to be properly displayed on my website. I have created an SVG icon in Illustrator with a font from Adobe Typekit, it's Proxima Nova.

@Shelley591

By converting the text to an outline, it will cease to be text and search engines will not be able to index its content (until they can interpret outlines, which is probably coming). Although SVG will support web fonts via CSS, this isn't currently an option with Typekit, which depends upon an embedded JavaScript fragment in a web page. This looks like a programmatic challenge for now; there appears to be a jQuery plugin that will get you most, if not all, of the way: github.com/willemvb/svg-typekit

Vote Up Vote Down

@Murphy569

It's best practice to convert all fonts into outlines when exporting to SVG, otherwise the font has to be installed on the users OS.
As Proxima Nova is not included in any OS font library, the browser uses a different standard font family. Only a few browsers support SVG fonts (see here), thats why it will show a different font even if you have Proxima Nova installed on your OS.

To convert the font, select convert to outline in the saving dialog (see image; sry for german).

This way your logo should show correctly in every browser.

Vote Up Vote Down