nicetool.dev logo

Генератор PWA-ресурсов - Создание иконок и манифеста приложения

Создавайте иконки PWA и манифест локально в браузере. Ваши изображения никогда не покидают устройство.

Загрузить изображение

Перетащите изображение сюда или нажмите, чтобы выбрать файл

Поддерживается PNG/JPEG, минимум 512x512px

Конфигурация манифеста

Предпросмотр Иконок

192x192

192x192px

Android / Chrome

512x512

512x512px

Заставка

180x180

180x180px

Домашний экран iOS

512x512

512x512px

Маскируемая (Адаптивная)

Предпросмотр Манифеста

HTML Ссылки для Head
💡 Вся обработка происходит на стороне клиента для обеспечения конфиденциальности и скорости.
Что такое PWA Генератор Ассетов?
PWA Генератор Ассетов - это бесплатный инструмент, который помогает создать все необходимые ассеты для Прогрессивных Веб-Приложений (PWA) из одного исходного изображения. Инструмент автоматически генерирует favicon.ico, apple-touch-icon, иконки различных размеров (16x16, 32x32, 192x192, 512x512...) и полный файл manifest.json. Вся обработка происходит на стороне клиента, обеспечивая высокую скорость и абсолютную безопасность ваших изображений.
Стандартные Размеры PWA Иконок
Инструмент автоматически генерирует иконки в соответствии со стандартами PWA и Apple, включая:
Favicon
favicon.ico (32x32) - Иконка, отображаемая во вкладке браузера
Мобильные и Планшеты
192x192, 384x384, 512x512 - Иконки для Android и домашнего экрана
Apple Touch Иконка
180x180 - Иконка для iOS при добавлении на домашний экран
Различные Размеры
16x16, 32x32, 48x48, 72x72, 96x96, 120x120, 144x144, 152x152, 167x167
Manifest.json - Сердце PWA
Файл manifest.json является самым важным конфигурационным файлом для PWA, содержащим информацию о:
  • •Имя приложения (name, short_name) - Отображается при установке
  • •Иконки - Список всех иконок с размерами и назначениями
  • •Цвет темы - Основной цвет для панели приложения и адресной строки
  • •Стартовый URL - URL запуска при открытии приложения с домашнего экрана
  • •Режим отображения - Режим отображения (standalone, fullscreen...)
Ключевые Особенности
1
Загрузка HD Изображения
Поддерживает PNG/JPEG с минимальным размером 512x512px для наилучшего качества
2
Генерация Иконок Разных Размеров
Автоматическое изменение размера и создание 13+ размеров иконок в соответствии с рекомендациями PWA и Apple
3
Авто Manifest.json
Генерация стандартного manifest.json с полными метаданными и ссылками на иконки
4
Favicon.ico
Создание стандартного favicon.ico для SEO и отображения во вкладках браузера
5
Обработка на Стороне Клиента
100% браузерная обработка, изображения никогда не загружаются на сервер
6
Скачать ZIP
Упаковка всех файлов в один удобный .zip файл
Реальные Применения
1
Разработка PWA
Быстро создавайте ассеты для проектов Прогрессивных Веб-Приложений, экономя часы ручной работы
2
Брендинг Веб-сайтов
Создавайте профессиональные фавиконы и сенсорные иконки для веб-сайтов, повышая узнаваемость бренда
3
Лендинг Мобильного Приложения
Подготовьте ассеты для устанавливаемых веб-страниц, работающих как нативные приложения на мобильных устройствах
Преимущества SEO и UX
✓
Favicon увеличивает CTR в SERP - Пользователи легче узнают ваш сайт
✓
PWA улучшает Core Web Vitals - Лучшее ранжирование в Google
✓
Apple Touch Иконка - Нативный опыт при добавлении на Домашний Экран iOS
✓
Полный manifest.json - Google лучше индексирует и понимает ваше приложение
Важные Примечания
  • •Исходное изображение должно быть минимум 512x512px, рекомендуется 1024x1024px
  • •Используйте изображения с прозрачным фоном (PNG) для наилучших результатов
  • •Вся обработка происходит локально, изображения не загружаются на сервер
  • •ZIP файл включает: favicon.ico, иконки (13 размеров), manifest.json
 Как пользоваться: Генератор PWA-ресурсов
  1. 1
    Загрузите квадратный логотип PNG или JPEG размером не меньше 512 x 512 пикселей. Простая форма с полями по краям лучше всего смотрится в маленьких размерах.
  2. 2
    Заполните поля манифеста: название приложения, короткое имя (под иконкой на главном экране), описание, стартовый URL, цвет темы и цвет фона.
  3. 3
    Включите круглую маску, если нужны круглые иконки, и проверьте превью для Android, iOS, заставки и maskable-иконки.
  4. 4
    Нажмите Generate & Download, чтобы получить ZIP со всеми размерами иконок и manifest.json. Скопируйте показанные ниже теги link в <head> сайта.
 Практические примеры
Сделать сайт устанавливаемым
Chrome и Edge предлагают «Установить приложение» только при наличии корректного манифеста с иконками 192 и 512 пикселей. Сгенерированные файлы закрывают эти требования.
Иконки главного экрана iOS
Safari игнорирует иконки манифеста и использует apple-touch-icon. В ZIP есть иконка 180 x 180 и соответствующий тег link.
Maskable-иконки для Android
Android обрезает иконки в круг или скруглённый квадрат в зависимости от устройства. Maskable-иконка держит логотип в безопасной зоне, поэтому он не обрезается.
Быстрый ребрендинг
Если логотип поменялся, загрузите новый файл один раз и замените весь набор иконок вместо ручного экспорта десятка размеров.
 Частые вопросы
Что такое манифест веб-приложения?+
manifest.json - небольшой JSON-файл, который сообщает браузеру название, иконки, цвета и стартовый URL веб-приложения. Именно он позволяет устанавливать сайт и запускать его как нативное приложение.
Какие размеры иконок обязательны?+
Для установки Chrome требует минимум 192 x 192 и 512 x 512. iOS использует apple-touch-icon 180 x 180. Дополнительные размеры делают иконку чётче в некоторых лаунчерах и на старых устройствах.
Чем theme_color отличается от background_color?+
theme_color окрашивает панель браузера и переключатель задач. background_color заливает экран-заставку во время загрузки и должен совпадать с фоном первого экрана.
Загружаются ли мои изображения?+
Нет. Масштабирование и упаковка в ZIP выполняются через Canvas API в браузере, поэтому неопубликованные логотипы не покидают ваше устройство.