How do you export SVGs from Sketch so that they are convenient for a front-end developer to work with?

S

saveTibet2017-10-23 15:29:49

SVG

saveTibet, 2017-10-23 15:29:49

For example, all the icons in my layout are made with symbols, which use the vector shape of the icon as a mask for overlaying the symbol-color (for those who are not familiar with symbol overrides, google it). This is convenient for me, as a designer, because I can change the colors of icons inside symbols in two clicks, but it is inconvenient for the front-ender, because when exporting these icon symbols to svg, a lot of unnecessary garbage appears in the code, in particular tags and much more. The Sketch has the SVGO-compressor plugin installed, but it doesn't completely clean up the garbage. Is there a way to make both the icons easy to use and clean output code?

Reply

Answer the question

In order to leave comments, you need to log in

2 answer(s)

M

Maxim Timofeev, 2017-10-23
@webinar

There are online services and software for cleaning and optimizing svg, for example:
https://yandex.ru/search/?text=svg%20cleaner&lr=13...

I

Ivnika, 2017-11-11
@Ivnika

Perhaps the article The Best Way to Export an SVG from Sketch https://medium.com/sketch-app-sources/the-best-way...