¿Qué es un icono de app? Definición, tamaños y cómo funciona
¿Qué es un icono de app?
Un icono de app es la pequeña imagen cuadrada que representa a una aplicación en un teléfono, una tablet o una computadora. Es la imagen que tocas para abrir la app, la miniatura que pasas de largo mientras navegas por la tienda, y la marca que aparece junto al nombre de la app en una hoja para compartir. Un solo archivo, o más a menudo un conjunto de archivos, funciona al mismo tiempo como botón, etiqueta y marca.
El término se solapa con algunos vecinos, y las fronteras son fáciles de difuminar. Un logo es la marca de la empresa y puede tener cualquier forma. Esa versión cuadrada en el dispositivo es la que la gente toca. Un favicon es el equivalente del sitio web en una pestaña del navegador. Y un icono de notificación es el pequeño glifo que una app muestra en la barra de estado mientras se ejecuta. Si preguntas qué es un icono de app, la mayoría se refiere a esa imagen cuadrada del lanzador, que es lo que cubre esta guía.
Icono de app vs logo vs favicon
Los tres se confunden porque a menudo se parecen a propósito. Las diferencias están en la forma, el tamaño y dónde vive cada uno:
| Icono de app | Logo | Favicon | |
|---|---|---|---|
| Forma | Cuadrado, con las esquinas redondeadas por el sistema operativo | Cualquier forma | Cuadrado, se muestra pequeño y a menudo redondo en las pestañas |
| Vive en | Pantalla de inicio, tienda de apps, ajustes | Encabezado del sitio web, tarjeta de presentación, empaque | Pestaña del navegador, lista de marcadores, historial |
| Tamaños típicos | Máster de 1024 px, reducido a 48 px o menos | Vectorial, cualquier tamaño | 16 px, 32 px, 48 px, 180 px apple-touch-icon |
| Quién le da forma | Tú diseñas el cuadrado, el sistema lo redondea y lo escala | Tú o tu diseñador | Tú lo publicas junto con el sitio |
Un favicon, para definirlo directamente, es el pequeño archivo de imagen que un sitio web publica para que los navegadores puedan mostrar su marca en pestañas y listas de marcadores. Si necesitas la parte web de este tema, la guía de favicons de MDN explica la mecánica, y el generador de iconos de sitio de SparkIconAI corta un máster en todos los tamaños de favicon y PWA en una sola pasada.
¿Cuál es el tamaño del icono de app para iOS?
En el lado de Apple, entregas un máster cuadrado de 1024 x 1024 px, en PNG y sin transparencia. Desde Xcode 14, ese único máster es todo lo que necesita el catálogo de recursos: iOS deriva de él todos los demás contextos, la pantalla de inicio, Spotlight, los ajustes y las notificaciones. La guía de iconos de apps de Apple pide un cuadrado a sangre, sin márgenes, porque el sistema, y no el diseñador, aplica las esquinas redondeadas, y con iOS 26 el sistema también puede aplicar su tratamiento Liquid Glass a los iconos de la pantalla de inicio. En la práctica, eso significa que nunca debes incluir esquinas redondeadas en el archivo que envías.
¿Cuál es el tamaño del icono de app para Android?
Android pide dos cosas. El icono de ficha de Google Play es un PNG de 32 bits de 512 x 512 px. El icono del lanzador es un icono adaptable: dos capas, fondo y primer plano, de 108 dp cada una, de las cuales los 72 dp centrales sobreviven a la máscara y un círculo centrado de 66 dp es la zona segura garantizada. Distintos lanzadores enmascaran esa forma de manera distinta, algunos con forma redonda, otros con squircle, y por eso la regla es mantener la parte importante de tu marca dentro del círculo seguro. La documentación de iconos adaptables tiene la especificación completa, y el generador de iconos de Google Play exporta tanto el recurso de ficha de 512 px como el conjunto mipmap a partir de un máster.
¿Qué es una insignia de icono de app en Android?
Una insignia de icono de app es el pequeño punto o número que aparece en la esquina del icono cuando la app tiene una notificación pendiente. Google llama a la forma de punto puntos de notificación, una función disponible desde Android 8.0. El One UI de Samsung llama a lo mismo insignias de iconos de apps y te permite elegir entre un punto y un número para cada app, y por eso la frase se lee diferente en un teléfono Samsung que en un Pixel. Mantén pulsado el icono para echar un vistazo a las notificaciones, o activa o desactiva la función en Ajustes, dentro de Notificaciones. La insignia la dibuja el sistema, así que no hay nada que diseñar dentro del archivo en sí, aunque es una razón más para mantener despejado el centro de tu marca.
¿Qué es el icono de apps en Android?
En muchos teléfonos Android, el icono de apps es el botón de la parte inferior de la pantalla de inicio, por lo general un círculo o una cuadrícula de puntos, que abre el cajón de apps: la lista alfabética completa de todas las apps instaladas. Es un control de navegación, no el icono de una aplicación, y esa es la confusión que suele traer la pregunta. Su aspecto cambia con el lanzador, y con la navegación por gestos desaparece por completo, reemplazado por un deslizamiento hacia arriba.
Ya que estamos descifrando marcas poco familiares: un icono de letra suelto en la barra de estado, como un icono T en Android, casi nunca viene del propio sistema. Android no incluye ningún símbolo T de fábrica, así que proviene de una app de terceros que publicó una notificación, a menudo una cuyo nombre empieza con esa letra. Revisar el historial de notificaciones en Ajustes te revela el nombre de la app en pocos segundos.
Cómo se crean los iconos
Hay dos formas de conseguir el máster cuadrado. La forma clásica es que un diseñador lo dibuje en software vectorial sobre una cuadrícula, ajustando la silueta hasta que se lea bien a 48 px. La forma más nueva es generativa: describes la marca en una frase, un modelo de IA devuelve un máster de 1024 px, e iteras cambiando el prompt o creando ramas. El segundo camino es lo que hace SparkIconAI: describes el icono, generas candidatos, los revisas a 16 px y luego exportas los tamaños de tienda y web desde un máster. Si quieres el proceso de diseño completo, la guía y el generador de diseño de iconos recorre las decisiones de concepto, tipografía y silueta, y el generador de iconos con IA es la forma más rápida de crear tu primer icono.
FAQ rápida
- ¿Qué es un generador de favicons? Una herramienta que convierte un máster cuadrado en los archivos de favicon que un sitio necesita: favicon.ico, el apple-touch-icon de 180 px y los iconos PWA de 192 y 512 px. El generador de iconos de sitio hace exactamente ese corte.
- ¿Qué es el diseño de iconos? La práctica de dibujar símbolos que representan objetos e ideas, lo que abarca las marcas de tu pantalla de inicio, los iconos de interfaz y los conjuntos de identidad de marca. La página de diseño de iconos cubre los tipos, las reglas y el flujo de trabajo con IA.
- ¿Una sola imagen puede servir para todos los tamaños? Sí, cuando la silueta es lo bastante simple. Diseña el máster de 1024 px, previsualízalo a 48, 32 y 16 px, y simplifica la forma en lugar de la idea si se vuelve borrosa.
- ¿Necesito esquinas redondeadas en el archivo? No. Tanto iOS como Android aplican su propio enmascaramiento, así que envía un cuadrado a sangre, sin márgenes, y deja que el sistema lo redondee.