Generador de Paquetes PWA

1 Configuración del Manifiesto y Caché

manifest.json + sw.js

Nombre de la Aplicación name

Nombre Corto 3/12 máx

Descripción description

URL de Inicio start_url

Identificador de Caché CACHE_NAME

Estrategia de Caché del Service Worker fetch

Modo de Visualización display

Orientación orientation

Barra de Estado iOS apple-status-bar

Color del Tema theme_color

Color de Fondo de Arranque (Splash Screen) background_color

2 Generador de Activos Gráficos y Simulador Móvil

512 · 192 · 180 · 32px

Seleccione un Icono Universal (10 plantillas multipropósito)

Paletas de Color Predefinidas Sincronizar con colores del manifiesto

Color de Fondo Principal

Color Secundario (Degradado)

Color del Icono / Trazo

Usar Iniciales (Opcional) Vacío = Usa Icono

Escala del Símbolo 56%

Radio de Borde 18%

Mostrar área segura (Maskable) Guía circular del 80% para recortes adaptativos en Android/iOS

Añadir borde interior sutil Realza el perímetro del icono sobre fondos oscuros

icon-512.png

icon-192.png

apple-touch (180)

favicon-32x32

09:41

Ajustes

Archivos

App

Agenda

Consola

Navegador

Aplicación Web

display: standalone

3 Inyección HTML y Optimización Smartphone

Adaptación iOS / Android

Toque para seleccionar o arrastre el archivo index.html de su aplicación

Inyecta automáticamente las etiquetas PWA, el viewport móvil y el registro del Service Worker

Inyectar CSS de optimización móvil Aplica márgenes Safe-Area para Notch, bloquea el pull-to-refresh accidental en modo standalone y elimina el retardo táctil

Incluir indicador visual de modo sin conexión Muestra un aviso discreto cuando la aplicación opera sin red sirviendo datos desde la caché local

index.html procesado e incluido en el paquete ZIP.

4 Archivos Generados y Exportación

Estrategia: Network-First