Tipos de diagrama de Mermaid
Mermaid convierte descripciones breves de texto en diagramas. Cada guía explica para qué sirve el diagrama, muestra un ejemplo que puedes abrir en TryMermaid y enumera la sintaxis que necesitas.
Diagrama de flujo
Visual canvasMostrar los pasos y las decisiones de un proceso.
Read the guide →Diagrama de secuencia
Mostrar mensajes entre usuarios, servicios o API a lo largo del tiempo.
Read the guide →Diagrama de clases
Visual canvasModelar las clases del código y cómo se relacionan.
Read the guide →Diagrama entidad-relación
Diseñar tablas de base de datos y sus relaciones.
Read the guide →Diagrama de estados
Describir los estados de algo y qué los cambia.
Read the guide →Mapa mental
Hacer una lluvia de ideas o un esquema alrededor de un tema.
Read the guide →
Which Mermaid diagram should I use?
Start from what you want to show. Every diagram type works in the TryMermaid code editor with a live preview, and flowcharts can also be edited on the visual canvas.
| If you want to… | Use | Mermaid keyword |
|---|---|---|
| Mostrar los pasos y las decisiones de un proceso | Diagrama de flujo | flowchart TD |
| Mostrar mensajes entre usuarios, servicios o API a lo largo del tiempo | Diagrama de secuencia | sequenceDiagram |
| Modelar las clases del código y cómo se relacionan | Diagrama de clases | classDiagram |
| Diseñar tablas de base de datos y sus relaciones | Diagrama entidad-relación | erDiagram |
| Describir los estados de algo y qué los cambia | Diagrama de estados | stateDiagram-v2 |
| Hacer una lluvia de ideas o un esquema alrededor de un tema | Mapa mental | mindmap |