1
Sube una imagen de diagrama
Empieza con una captura de diagrama de flujo, una imagen exportada o una página PDF clara.
imagen a Mermaid
Convertidor de Imagen a Mermaid
Sube una captura de un diagrama de flujo, una imagen de diagrama o una página PDF y convierte la estructura visible en código Mermaid editable para revisar, ajustar y usar en documentación.
Convierte la estructura visible de un diagrama de flujo en un borrador editable de código Mermaid.
Útil para Markdown, GitHub, Notion, archivos README y documentación técnica.
Revisa el resultado en el lienzo y luego copia o exporta la fuente Mermaid más reciente cuando esté disponible.
Supported inputs
PNGJPGJPEGWEBPGIFPDF
Antes y después
From diagram image to editable Mermaid code
Upload a flowchart screenshot, diagram image, or PDF page. ChatFlowchart rebuilds the structure and generates Mermaid code you can copy into docs, GitHub, or Markdown.
Before
Diagram image or PDF page
Static visual source
After
Mermaid code and rendered preview
Code you can copy, edit, and render
Mermaid codeRendered previewMarkdown-readyEditable labels
Flat file vs rebuilt diagram
Diagram locked in an imageFlow rebuilt as Mermaid syntax
Manual redraw neededCopy code into docs
Labels are visual onlyRename labels in code
Hard to versionReview changes in text diffs
What to expect
Best for clear flowcharts and architecture diagrams. Review dense labels and branch directions before publishing.
Generate Mermaid codeHow conversion works
Start with the source file, let AI rebuild the visible structure, then review the editable result on canvas.
2
La IA reconstruye el diagrama
ChatFlowchart detecta pasos, decisiones, etiquetas, flechas y direcciones de conexión visibles.
3
Revisa el código Mermaid
Abre el lienzo generado, revisa la estructura y usa la fuente Mermaid más reciente cuando esté disponible.
Editable result
What you can edit after conversion
ChatFlowchart rebuilds the visible diagram as editable diagram objects, so the output can be reviewed and refined instead of staying locked inside a flat image.
Etiquetas
Revisa y edita los textos visibles después de reconstruir el diagrama de flujo.
Formas
Mueve, redimensiona, añade o elimina cajas de proceso, nodos de decisión y otros elementos del diagrama.
Conectores
Reconecta flechas, ajusta la dirección del flujo y corrige ramas ambiguas cuando sea necesario.
Diseño
Limpia el espaciado, la alineación, la agrupación y el orden de lectura en el lienzo editable.
Estilo
Aplica un estilo de boceto o un estilo moderno antes de exportar el diagrama final.
Casos de uso
Pensado para recuperar diagramas y flujos de trabajo reales
Cada página de conversión se centra en un objetivo de salida concreto, para que empieces con el formato o flujo de trabajo que necesitas.
Documentación en GitHub
Convierte capturas de diagramas en fuente Mermaid para archivos README y documentación de ingeniería.
Documentación Markdown
Recrea diagramas de flujo como diagramas basados en texto para sitios de documentación, wikis y bases de conocimiento.
Notas en Notion
Recupera la estructura del diagrama desde capturas antes de documentar el proceso en notas de equipo.
Notas de arquitectura
Convierte diagramas simples de arquitectura en borradores editables de código Mermaid para planificación técnica.
Diagramas de proceso
Convierte capturas de workflows en diagramas de flujo Mermaid más fáciles de editar y mantener.
Detalles
Qué debes saber antes de convertir
Convertir imágenes y capturas a código Mermaid
La conversión de imagen a Mermaid es útil cuando un diagrama de flujo o proceso solo existe como captura, exportación o página PDF, pero necesitas código Mermaid editable para documentación.
ChatFlowchart reconstruye la estructura visible del diagrama como un borrador editable para que puedas revisar el flujo, ajustar las etiquetas y usar la fuente Mermaid cuando esté disponible.
Crear diagramas basados en código para documentación
Un flujo de captura a Mermaid ayuda a desarrolladores, equipos de producto y redactores técnicos a convertir diagramas estáticos en diagramas basados en código para Markdown, GitHub, Notion, archivos README y documentación.
Para mejores resultados, empieza con diagramas de flujo de alto contraste, árboles de decisión y diagramas de proceso con etiquetas legibles. Las capturas densas, el texto pequeño o los diseños complejos que no son flowcharts pueden requerir limpieza manual.
Results and quality
Supported outputs and best results
Se admiten imágenes, capturas de pantalla, fotos de pizarras y archivos PDF. Los PDFs con texto se pueden extraer directamente; los PDFs escaneados funcionan mejor cuando el diagrama, las etiquetas y las flechas se ven con claridad.
Entradas compatibles
PNGJPGJPEGWEBPGIFExtracción de texto PDF
Salidas compatibles
Lienzo editable de ChatFlowchartPNGSVGPDFArchivo Draw.ioMermaidEnlace para compartir
La disponibilidad de exportación depende de las opciones actuales del lienzo de ChatFlowchart.
Lienzo editable
- Free
- Sí
- Pro
- Sí
- Notes
- Espacio principal para revisar y refinar el diagrama reconstruido.
PNG
- Free
- Con marca de agua
- Pro
- Sin marca de agua / alta resolución
- Notes
- Ideal para compartir rápido, presentaciones y documentación visual.
SVG
- Free
- Limitado
- Pro
- Sí
- Notes
- Ideal para documentación escalable, sitios web y entrega a diseño.
- Free
- Limitado
- Pro
- Sí
- Notes
- Útil para compartir el diagrama limpio como documento.
Archivo Draw.io
- Free
- Limitado
- Pro
- Sí
- Notes
- Disponible para flujos de trabajo compatibles con diagramas editables de Draw.io.
Mermaid
- Free
- Copiar cuando esté disponible
- Pro
- Exportación avanzada
- Notes
- Útil para Markdown, GitHub, Notion y documentación técnica.
Best results checklist
- Usa imágenes claras o páginas PDF con etiquetas legibles.
- Recorta la carga a un solo diagrama o proceso cuando la fuente tenga varios gráficos no relacionados.
- Mantén visibles las puntas de flecha, las líneas conectoras y las etiquetas de decisión.
- Usa capturas de pantalla con alto contraste o fotos de pizarra tomadas de frente.
- Revisa etiquetas, flechas y direcciones de rama antes de exportar el diagrama final.
- Usa capturas claras de diagramas de flujo con etiquetas legibles cuando necesites código Mermaid para documentación.
Limitations and cleanup
- Los diagramas densos pueden requerir limpieza manual después del primer borrador generado por IA.
- El texto borroso, recortado o con poco contraste puede reducir la precisión de las etiquetas.
- Los PDFs escaneados o basados en imagen funcionan mejor cuando la página objetivo es clara.
- El resultado es un diagrama editable reconstruido, no una recuperación de metadatos ocultos del archivo original.
- Conviene revisar la dirección de conectores, las etiquetas de ramas y los diseños complejos antes de compartir.
- El código Mermaid generado puede requerir limpieza de sintaxis, etiquetas o diseño en diagramas densos, borrosos o que no sean flowcharts.
After conversion
Continue from the converted diagram without rebuilding the file.
Abrir lienzo editable
Sigue refinando el diagrama reconstruido con ediciones manuales o chat con IA.
Exportar archivos finales
Exporta el diagrama terminado como PNG, SVG, PDF, Draw.io, Mermaid o enlace compartible cuando esté disponible.
Corregir con chat de IA
Pide a ChatFlowchart que renombre etiquetas, ajuste pasos, limpie el diseño o corrija flechas.
Informar calidad de conversión
Marca si el resultado se ve bien o necesita limpieza para diagnosticar mejor las entradas problemáticas.
FAQ
Preguntas antes de subir el archivo
Convierte una imagen de diagrama en código Mermaid
Sube una captura, imagen de diagrama o página PDF y reconstruye la estructura visible como un borrador Mermaid editable para documentación.