Как и где правильно сохранить svg?

Question

[freeman0204]

Скажу сразу что в дизайне все иконки векторные.
Сохраняю svg через Avocode. Какие возникают проблемы.
Иконка немного не соответствует оригиналу, иногда слегка обрезаны края иконки, и контур может быть в 2 раза больше.

Моя цель: перейти на svg потому что растр плохо отображается на телефонах и планшетах, мне не нравится. Хочу или svg в base 64 или в спрайт вообщем как то оптимально но использовать svg. Так же в нем есть много преимуществ. Одно из них как например фильтры. Можно перекрасить иконку и через css и не делать отдельную иконку на ховер. Еще знаю что например если у вас в магазине 3 товара с разными цветами вам не нужно 3 картинки а можно перекрасить это через svg.

Подскажите как вы сохраняете svg и как используете? И как избавляетесь от выше перечисленных проблем?

Answer 1

[sergey]

Сохраняются стандартно, в виде файла:))), а использую инлайново или спрайтом (если их много)

<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="220px" height="140px" viewBox="0 0 220 140">............
</svg>

Comments

[freeman0204]

Через какую программу сохраняете?

[sergey]

Артур Черешнюк: svg? по-разному, обычно вытягиваю с макета (assets.adobe) когда верстаю, иногда копирую с хранилищ svg (куча иконок), а иногда и создаю сам. Вот хорошая статья: frontender.info/using-svg

[freeman0204]

SM: Спасибо. И каждый раз все гладко, никаких багов с отображением что я говорил выше?

[sergey]

Артур Черешнюк: все гладко, я использую gulp, с его помощью формирую спрайты. А одиночные svg вставляю так как говорилось в статье и я говорил. Сбоев не было:)