Гайд по favicon и PWA
Проверьте состав обязательных файлов для сайта и PWA.
Как собрать пакет иконок из SVG
Загрузите SVG, настройте цвет и отступы, затем экспортируйте favicon, app-иконки, manifest и ZIP.
Рекомендации по SVG
- Используйте статичный SVG без скриптов, foreignObject и внешних ресурсов.
- Чем проще векторная структура, тем стабильнее рендер в разных размерах.
- Если результат отличается от ожиданий, упростите SVG или перейдите на PNG.
Практический сценарий
- Загрузите SVG и проверьте preview источника и обнаруженных границ.
- Выберите режим цвета (исходный/пользовательский) и нужный padding mode.
- Проверьте preview малых размеров, чтобы заметить тонкие линии или потерянные заливки.
- Скачайте ZIP с favicon, Apple/PWA/maskable PNG и site.webmanifest.
Полный пример
Вход: Одноцветный SVG-логотип для SaaS-сайта.
Настройки: Пользовательский цвет #2563eb + Balanced padding + прозрачный фон.
Выход: Единый стиль цвета и отступов на всех экспортированных размерах.
Советы по SVG-конвертации
- Inline fill обычно конвертируется предсказуемее, чем CSS-переменные или внешние стили.
- Если пользовательский цвет выглядит неверно, упростите SVG до однотонной формы.
- Храните исходный SVG рядом с ZIP, чтобы повторить экспорт при будущих изменениях.
FAQ
Сохраняются ли сложные SVG-фильтры без изменений?
Не всегда. Сложные фильтры и внешние шрифты могут отличаться после растеризации.
Как работает пользовательский цвет для SVG?
Инструмент применяет однотонную заливку по alpha-маске отрендеренного SVG.
Можно ли получить favicon.ico из SVG?
Да. SVG сначала рендерится в canvas, затем используется общий PNG/ICO pipeline.
Когда использовать исходный цвет, а когда пользовательский?
Исходный — когда бренд-цвет уже готов; пользовательский — для единой однотонной системы.
Связанные сценарии иконок
Гайд по safe-area maskable
Снизьте риск обрезки контента при экспорте maskable-иконок.
Связанные инструменты
Timestamp Converter
Проверяйте временные метки в релизных логах и интеграциях.
QR Code Tool
Создавайте QR-коды для страниц, где используются экспортированные иконки.
JSON Formatter
Форматируйте manifest JSON перед коммитом app metadata.