PixRinseLas capturas de pantalla muestran la aplicación en inglés. Los nombres y controles preestablecidos también están disponibles en el idioma de su aplicación.
Tu punto de partida
Utilice Conjunto de favicons en PixRinse, luego revise estas configuraciones con respecto a su destino real.
| Favicon PNG | 16 / 32 / 48 px |
|---|---|
| Apple Toque PNG | 180 px |
| PNG de aplicaciones web | 192 / 512 px |
| Color | sRGB |
como hacerlo
Prepare una marca de origen cuadrada.
Utilice una fuente al menos tan grande como el icono más grande que necesite. Simplifique los detalles finos que pueden desaparecer en 16 px.
Elija Conjunto de favicons
Revisa los seis tamaños. La plantilla utiliza una regla de cobertura centrada, por lo que se puede recortar una fuente que no sea cuadrada.
Inspeccionar las salidas más pequeñas.
Verifique los archivos 16 y 32 px en tamaño real. El cambio de tamaño automático no puede reemplazar los ajustes ópticos deliberados de una marca compleja.
Exporte imágenes y agregue sus referencias al código de su sitio web
Agregue los archivos PNG a su sitio web y haga referencia a los tamaños relevantes en el encabezado HTML y en el manifiesto de la aplicación web.
LOS ARCHIVOS DE ESTE RECORRIDO
Lo que produjo este ejemplo
Una marca cuadrada 1024 × 1024 produce seis PNG sin la advertencia de fuente no cuadrada. Cada archivo exportado contiene un perfil sRGB.
- fuente cuadrada
- 1024 × 1024
- PNG exportaciones
- 6
- Perfil de color
- sRGB en cada salida
| Archivo | Formato | Píxeles | bytes |
|---|---|---|---|
| android-chrome-192x192.png | PNG | 192 × 192 | 26,980 |
| android-chrome-512x512.png | PNG | 512 × 512 | 174,868 |
| apple-touch-icon.png | PNG | 180 × 180 | 23,839 |
| favicon-16x16.png | PNG | 16 × 16 | 692 |
| favicon-32x32.png | PNG | 32 × 32 | 1,751 |
| favicon-48x48.png | PNG | 48 × 48 | 3,093 |
Medido en los archivos de muestra que se muestran. Sus resultados dependen de sus originales y configuraciones. Este tutorial utiliza obras de arte propiedad de PixRinse en lienzos de muestra cuadrados o transparentes.
Un par de preguntas comunes
¿Crea favicon.ico?
No. El conjunto integrado exporta seis archivos PNG con nombres de archivo específicos.
¿Funcionará un logotipo ancho?
Es preferible una fuente cuadrada. La regla de cobertura puede recortar una fuente amplia, así que revise la vista previa detenidamente.
Ponga el flujo de trabajo a trabajar.
Abra PixRinse, agregue algunas imágenes y comience con la configuración anterior.
Descargar para MacGratis: hasta 10 imágenes por lote y una salida por fuente. Las múltiples salidas de este flujo de trabajo requieren Pro. Comparar gratis y profesional.