CodeKitHub¿Qué es esta herramienta?
El Generador de chats de Messenger es una herramienta de maquetación basada en el navegador que recrea la interfaz de Facebook Messenger — sus característicos burbujas azules de salida con esquinas redondeadas, la barra superior con nombre de contacto y línea de estado activo, y la barra de estado del teléfono — para que puedas escribir tu propia conversación y exportarla como una imagen para compartir.
Las burbujas de salida de Messenger usan un azul sólido distintivo, y este generador replica ese aspecto por defecto, mientras que el interruptor de tema claro/oscuro cambia el resto de la interfaz para igualar cualquiera de los dos modos de apariencia de Messenger.
Solo para entretenimiento y diseño: esta herramienta está pensada para bromas, memes, sketches, diapositivas de presentaciones, prototipos de UI/UX y contenido para redes sociales. Nunca debe usarse para fabricar pruebas fraudulentas, acosar o difamar a alguien, ni suplantar mensajes reales de una persona real — hacerlo puede ser ilegal según tu jurisdicción y va estrictamente en contra del uso previsto de esta herramienta.
Nada de lo que escribas sale nunca de tu dispositivo — toda la conversación se dibuja con la API de Canvas de HTML directamente en tu navegador, y el PNG se genera y descarga de forma local. No hay subida a ningún servidor, ni cuenta, ni seguimiento del contenido de tus mensajes.
¿Por qué utilizarlo?
- Estás grabando un video de reacción o storytime para TikTok y necesitas mostrar en pantalla una conversación de Facebook Messenger creíble sin exponer tu chat real ni el de nadie más.
- Un cliente te pidió maquetar cómo se vería una notificación push o un widget de chat inspirado en Messenger para una app, y necesitas una referencia visual fiel al azul característico.
- Estás armando un meme o sketch de humor con una conversación inventada y quieres que las burbujas azules redondeadas se vean auténticas, no como un montaje improvisado.
- Escribes contenido educativo sobre seguridad digital y necesitas ejemplos de conversaciones de phishing o estafas por Messenger para enseñar a identificarlas, sin usar capturas reales de víctimas.
- Quieres ilustrar un guion o storyboard con una escena de mensajería y prefieres editar texto directamente en el navegador en vez de retocar capturas reales en un editor de imágenes.
- Renderizado 100% local: el texto de tu conversación nunca toca un servidor.
Cómo utilizarlo
- Define el nombre del contacto, el texto de estado (por ejemplo «Activo ahora») y elige tema claro u oscuro.
- Sube una foto para el avatar, o déjalo como un círculo de color con iniciales.
- Añade filas de mensajes: escribe el texto, elige un lado (ellos/yo) y una marca de tiempo.
- Para tus propios mensajes, elige el estado de confirmación de lectura.
- Ajusta la barra de estado (hora, batería, señal) a tu gusto.
- Observa cómo se actualiza la vista previa con forma de teléfono en tiempo real y haz clic en «Descargar PNG» para guardar la imagen.
Ejemplo
Entrada
Contacto: «Alex» · Estado: «Activo ahora» · Mensaje 1 (ellos): «¿Seguimos en pie para esta noche?» · Mensaje 2 (yo, leído): «¡Sí! Nos vemos a las 8 😊»Resultado
Una imagen PNG de 375×812 que muestra una pantalla estilo Messenger: cabecera con «Alex» y «Activo ahora», una burbuja gris claro a la izquierda con el primer mensaje, y una burbuja azul redondeada a la derecha con la respuesta.La imagen se genera al instante en el lienzo de vista previa en vivo y se descarga con un solo clic — sin esperas, sin subidas.
Qué puedes personalizar
- Nombre del contacto, texto de estado y tema claro/oscuro.
- Avatar: sube una foto real (recortada en círculo) o elige un color por defecto.
- Filas de mensajes ilimitadas, cada una con su propio texto, lado (ellos/yo) y marca de tiempo.
- Estado de confirmación de lectura por cada mensaje que envías.
- Barra de estado del teléfono: hora, porcentaje de batería e intensidad de la señal.
Uso responsable
Este generador existe para facilitar la creación de imágenes de chat claramente ficticias con fines de humor, narrativa y diseño. No es una herramienta para fabricar pruebas, organizar acoso ni engañar a nadie haciéndole creer que una conversación falsa es real. Si piensas compartir una imagen creada con esta herramienta, considera añadir contexto (como «falso» o «maqueta») para que quien la vea entienda que no es una conversación real.
Elementos característicos de la interfaz de Messenger
| Elemento | Cómo se ve en Messenger | Cómo lo maqueta esta herramienta |
|---|---|---|
| Burbuja saliente | Azul sólido con esquinas muy redondeadas | Color fijo por defecto, ajustado al tema claro/oscuro |
| Línea de estado | "Activo ahora" o "Activo hace X min" | Campo de texto libre bajo el nombre del contacto |
| Confirmación de lectura | Avatar pequeño o «Visto» bajo el último mensaje | Estado configurable por cada mensaje propio |
| Avatar | Foto de perfil circular | Foto subida y recortada en círculo, o iniciales sobre color |
Preguntas frecuentes
¿Es legal o ético usar esta herramienta?
La herramienta en sí es legal de usar para entretenimiento, maquetas, presentaciones y trabajo de diseño. Lo que no es legal ni ético es usar la imagen generada para engañar a alguien — por ejemplo presentarla como una conversación real para cometer fraude, acosar o difamar a una persona, o suplantar los mensajes reales de alguien. Úsala solo con fines claramente ficticios o ilustrativos.
¿La herramienta sube mis mensajes o mi foto a algún sitio?
No. Cada mensaje, nombre, foto y ajuste que introduces permanece en la memoria de tu navegador y se dibuja directamente en un elemento canvas mediante JavaScript. El archivo PNG se genera y descarga en tu dispositivo — nada se envía nunca a ningún servidor.
¿Debería usar este generador o el de WhatsApp / Signal?
Si la escena que estás maquetando está específicamente ambientada en Facebook Messenger — con sus burbujas azules y la línea de estado «Activo ahora» — usa este para que la interfaz coincida. Si solo necesitas una captura de mensajería genérica para un meme sin el branding de Messenger, el Generador de chats personalizado te permite elegir tus propios colores de burbuja; si la escena está pensada para parecer WhatsApp o Signal específicamente, usa esos generadores dedicados para que los detalles de la plataforma (colores, tics, estilo de cabecera) coincidan con lo que esperan los espectadores.
¿Puedo subir una foto real como avatar?
Sí. Haz clic en «Subir foto» para usar cualquier imagen de tu dispositivo como avatar del contacto — se recorta automáticamente en forma de círculo. Si omites este paso, el avatar vuelve a ser un círculo de color con las iniciales del contacto. La foto solo se usa localmente en tu navegador y nunca se sube a ningún sitio.
¿Qué tamaño de imagen exporta?
La vista previa y el PNG exportado usan una proporción de pantalla de teléfono (375×812 por defecto), que se ve natural al compartirla en redes sociales o al incrustarla en una presentación.
¿Puedo simular la línea «Activo ahora» aunque el contacto no lo esté?
Sí, el texto de estado es completamente editable, así que puedes escribir «Activo ahora», «Activo hace 5 min» o dejarlo vacío según lo que necesite tu maqueta.
¿Puedo mostrar reacciones con emoji sobre un mensaje, como el «me gusta» de Messenger?
La herramienta se centra en recrear las burbujas de texto principales con sus marcas de tiempo y confirmaciones de lectura; no incluye reacciones flotantes tipo emoji sobre mensajes individuales.
¿Por qué las burbujas salientes son azules por defecto y no personalizables como en el generador de chat genérico?
Es intencional: el azul sólido es el elemento visual más reconocible de Messenger, así que fijarlo por defecto asegura que la captura se lea de inmediato como Messenger en vez de como una app genérica.