URL-кодировщик SVG
Преобразуйте разметку SVG в URI данных, готовый к CSS, и декодируйте URI данных обратно в SVG.
URL-кодировщик SVG
Вставьте SVG и получите URI данных, который вы можете поместить прямо в CSS, готовый для фонового изображения или маски. Вместо base64 кодировщик использует подход компактного URL-кодирования: он заменяет двойные кавычки одинарными, сжимает пробелы и кодирует в процентах только те символы, которые действительно в этом нуждаются, поэтому результат остается коротким и удобочитаемым. Благодаря этому ваша таблица стилей будет меньше, чем объект base64, и вы по-прежнему сможете распознавать фигуры внутри URI.
Три формата вывода охватывают распространенные случаи. Правило CSS оборачивает URI данных в фоновое изображение: url("…"); так что вы можете вставить целую декларацию. Простой URI данных дает вам только значение пользовательского свойства, источника <img> или маски SVG. Форма base64 создает безопасный UTF-8 data:image/svg+xml;base64 URI для инструментов или шагов сборки, которые ожидают эту кодировку, включая SVG с узлами смайликов или акцентированного текста.
Переключите направление на декодирование, и инструмент вернет любую из трех форм обратно в необработанную разметку SVG. Вставьте правило CSS, простой URI данных или правило base64, и оно извлечет SVG, чтобы вы могли редактировать значок, который существует только внутри таблицы стилей. Подсчет показывает входной размер, выходной размер и процентное изменение, поэтому вы можете сразу увидеть, уменьшилось или увеличилось кодирование значка.
Все работает в вашем браузере. Ваша разметка SVG никогда не загружается, поэтому вы можете кодировать частные значки, логотипы и внутренние ресурсы, не покидая вашего устройства.