Un lienzo visual de verdad
Arrastra formas al lienzo, conéctalas y renómbralas ahí mismo. Tu disposición se guarda con el diagrama y se usa en cada exportación.
Compatible con la sintaxis de Mermaid
Arrastra, escribe y comparte diagramas de Mermaid.
TryMermaid es un creador visual de diagramas que escribe el código por ti. Esboza un diagrama de flujo en el lienzo, ajústalo en código y exporta un PNG o SVG nítido.
Gratis · No necesitas cuenta para empezar
Visual cuando ayuda, código cuando es más rápido
Un mismo diagrama, dos formas de editarlo y nada que se pierda al cambiar de una a otra.
Código cuando lo necesites
Cada cambio en el lienzo escribe código Mermaid, y cada cambio en el código actualiza el lienzo. Usa el que te resulte más rápido.
Exporta a donde sea
Descarga un PNG con el ancho o el alto exactos que necesites, obtén un SVG o copia la imagen directamente al portapapeles.
Guarda y comparte
Guarda los diagramas en tu cuenta o comparte un enlace que abra exactamente lo que ves, con la disposición incluida.
De la idea a la imagen en tres pasos
- 01
Empieza
Elige una plantilla o suelta tu primera forma.
- 02
Dale forma
Conecta pasos, muévelos y ajusta el código.
- 03
Compártelo
Exporta una imagen o envía un enlace a tu equipo.
¿Qué diagramas de Mermaid puedes crear?
Todos los tipos de diagrama de Mermaid funcionan en el editor de código con vista previa en directo. Los diagramas de flujo además se editan en el lienzo visual. Todos se exportan a PNG y SVG.
| Tipo de diagrama | Lienzo visual | Código con vista previa | Exportar PNG y SVG |
|---|---|---|---|
| Flowchart | Sí | Sí | Sí |
| Sequence diagram | No | Sí | Sí |
| Class diagram | No | Sí | Sí |
| ER diagram | No | Sí | Sí |
| State diagram | No | Sí | Sí |
| Mind map | No | Sí | Sí |
| Gantt chart | No | Sí | Sí |
| Timeline | No | Sí | Sí |
| Pie chart | No | Sí | Sí |
| Git graph | No | Sí | Sí |
| User journey | No | Sí | Sí |
| Quadrant chart | No | Sí | Sí |
| Sankey diagram | No | Sí | Sí |
| XY chart | No | Sí | Sí |
| Block diagram | No | Sí | Sí |
| Packet diagram | No | Sí | Sí |
| Requirement diagram | No | Sí | Sí |
| C4 diagram | No | Sí | Sí |
Preguntas frecuentes
¿Qué es TryMermaid?
TryMermaid es un editor en línea para Mermaid, el lenguaje de diagramas basado en texto. Puedes arrastrar formas en un lienzo visual o escribir código Mermaid, y ambos se mantienen sincronizados. Los diagramas terminados se exportan como PNG o SVG, y también puedes compartir un enlace o incrustarlos en una página web.
¿TryMermaid es gratis?
Sí. El plan gratuito incluye el editor completo, exportación a PNG y SVG, enlaces para compartir y hasta 50 diagramas guardados. El plan Pro añade diagramas guardados ilimitados y conectores MCP para que los agentes de IA trabajen con tus diagramas.
¿Necesito una cuenta para crear un diagrama?
No. Abre el editor y empieza a dibujar de inmediato; tu trabajo se guarda en tu navegador. Crea una cuenta gratuita solo si quieres guardar diagramas y volver a abrirlos en otro dispositivo.
¿Qué tipos de diagrama de Mermaid puedo editar visualmente?
Los diagramas de flujo y los diagramas de clases se editan en el lienzo de arrastrar y soltar, y cada cambio se escribe de vuelta en código Mermaid. Los de secuencia, ER, estados, mapas mentales, Gantt, líneas de tiempo y los demás tipos se editan en código con vista previa en directo.
¿Cómo exporto un diagrama de Mermaid como PNG o SVG?
Abre el menú de exportación en el editor y elige PNG o SVG. Para PNG puedes fijar un ancho o un alto exactos, y también copiar la imagen directamente al portapapeles. Cuando el lienzo está abierto, la exportación usa la disposición que hayas colocado a mano.
¿En qué se diferencia TryMermaid de Mermaid Live Editor?
Mermaid Live Editor es el editor en línea del propio proyecto Mermaid. TryMermaid es un editor independiente construido sobre su código abierto (licencia MIT). Añade un lienzo de arrastrar y soltar sincronizado con el código, cuentas para guardar diagramas y enlaces para compartir que conservan tu disposición.
¿Puedo compartir o incrustar mis diagramas?
Sí. Copia un enlace que abra una copia exacta de tu diagrama, con la disposición incluida, o genera un fragmento para incrustar y mostrar un diagrama en vivo en tu web, documentación o blog.
¿Dónde se guardan mis diagramas?
Hasta que lo guardes, el diagrama vive solo en el almacenamiento local de tu navegador y en la URL de la página. Los diagramas que guardas en tu cuenta se almacenan en los servidores de TryMermaid para que puedas abrirlos desde cualquier dispositivo. La política de privacidad explica los detalles.
Del blog
Guías y comparativas sobre diagramas con Mermaid, contrastadas con fuentes primarias.
Mermaid vs PlantUML vs Graphviz
Three text-to-diagram tools, three different jobs. What each one draws, what it needs installed, where it renders, and how to pick without rewriting your diagrams later.
Leer el artículo →How to Generate Mermaid Diagrams with Claude
Claude can write Mermaid on its own. An MCP server lets it check that code against the real parser, save it and hand back an image. Setup for four clients, plus a live run.
Leer el artículo →7 Best Mermaid Diagram Editors in 2026
The Mermaid Live Editor and mermaid.ai, TryMermaid, mermaideditor.io, draw.io, Mermaid Viewer, Lucidchart and Eraser, compared on price, free-plan limits, AI and drag-and-drop editing.
Leer el artículo →