Visor de Diagramas ER de Mermaid
Pega código Mermaid erDiagram y previsualiza tu esquema de base de datos al instante. Exporta a SVG o PNG. Herramienta ER gratuita solo en el navegador.
Introduce código Mermaid para previsualizar tu diagrama
Los diagramas de Entidad-Relación (ER) son la notación estándar para visualizar esquemas de bases de datos relacionales. Muestran entidades (tablas), sus atributos (columnas) y las relaciones entre ellas: uno a uno, uno a muchos, muchos a muchos. La sintaxis `erDiagram` de Mermaid introduce la creación de diagramas ER en el mundo del texto como código, facilitando la documentación de esquemas de bases de datos en archivos README, ADR (Registros de Decisiones de Arquitectura) y descripciones de solicitudes de extracción. Cuando los ingenieros de bases de datos o los desarrolladores backend piden a los asistentes de IA que diseñen un esquema — 'Crea una base de datos para una plataforma de comercio electrónico con usuarios, productos y pedidos' — la respuesta a menudo incluye un diagrama ER de Mermaid. Pegar ese código en Zolkit te permite validar inmediatamente que las relaciones y cardinalidades reflejan las reglas de negocio previstas. El visor de diagramas ER de Zolkit admite completamente la sintaxis `erDiagram` de Mermaid, incluidas las definiciones de entidades con atributos tipados, anotaciones de claves primarias y foráneas, líneas de relación con notación de pata de gallo y etiquetas de relación en línea. Es utilizado por desarrolladores backend, arquitectos de bases de datos y redactores técnicos para documentar esquemas sin salir del navegador.
Visor y Exportador de Diagramas Mermaid Online Gratis
El Visor de Diagramas Mermaid de Zolkit te permite pegar cualquier código Mermaid y ver un diagrama renderizado al instante — sin instalación, sin registro, sin subidas a servidores. Todo se ejecuta en tu navegador, lo que lo convierte en la forma más rápida de verificar diagramas generados por IA desde Claude, ChatGPT o Gemini. Soporta todos los tipos principales de diagramas Mermaid: diagramas de flujo, diagramas de secuencia, diagramas de clases, diagramas ER, diagramas de Gantt, diagramas de estado, mapas mentales, gráficos Git, gráficos circulares y líneas de tiempo.
Vista Previa Instantánea en Vivo
Los diagramas se renderizan automáticamente mientras escribes, con un retardo de 300 ms para que nunca se sienta lento.
100% Privado
Todo el renderizado ocurre en tu navegador usando mermaid.js. Tu código nunca se envía a ningún servidor.
Exportar SVG y PNG
Descarga tu diagrama como un SVG vectorial nítido o un PNG de alta resolución 2× listo para documentos y presentaciones.
Todos los Tipos de Diagramas Mermaid
Soporta diagramas de flujo, diagramas de secuencia, diagramas de clases, diagramas ER, diagramas de Gantt, mapas mentales, gráficos Git y más.
Listo para Diagramas de IA
Construido para la era de la IA — previsualiza directamente diagramas generados por Claude, ChatGPT, Gemini o cualquier LLM.
Siempre Gratis
No se necesita cuenta, sin límites de uso, sin marcas de agua. El visor Mermaid de Zolkit es completamente gratuito para siempre.
Cómo Previsualizar un Diagrama Mermaid
- 1
Pega tu código Mermaid en el editor de la izquierda — puedes copiarlo desde un asistente de IA o escribirlo manualmente.
- 2
El diagrama se renderiza instantáneamente en el panel de vista previa de la derecha. Si hay un error de sintaxis, un mensaje explica el problema.
- 3
Haz clic en 'Exportar SVG' o 'Exportar PNG' para descargar tu diagrama como un archivo listo para documentación, presentaciones o compartir.
Preguntas Frecuentes
¿Qué símbolos de cardinalidad utiliza Mermaid para los diagramas ER?
Mermaid utiliza la notación de pata de gallo: `||--||` para uno-exacto a uno-exacto, `||--o{` para uno-exacto a cero-o-muchos, `}o--o{` para cero-o-muchos a cero-o-muchos, y `||--|{` para uno-exacto a uno-o-muchos. Estos se renderizan como símbolos estándar de pata de gallo en las líneas de relación, haciendo que la cardinalidad sea inmediatamente legible.
¿Cómo marco las claves primarias y foráneas en los diagramas ER de Mermaid?
Añade `PK` o `FK` después del tipo de columna en la definición de la entidad: `int id PK` para una clave primaria, `int userId FK` para una clave foránea. También puedes añadir `UK` para claves únicas. Estas anotaciones aparecen como etiquetas dentro del cuadro de la entidad y son esenciales para comunicar la estructura relacional del esquema.
¿Puedo documentar una relación de muchos a muchos en los diagramas ER de Mermaid?
Sí. Representa relaciones de muchos a muchos directamente con `}o--o{` o a través de una entidad de unión. Usar una entidad de unión (como ORDER_ITEM entre ORDER y PRODUCT) suele ser una mejor práctica, ya que modela el diseño real del esquema con mayor precisión y te permite añadir atributos a la propia relación, como la cantidad o el precio.
¿Cuál es la mejor manera de usar los diagramas ER de Mermaid en un proyecto?
Añade el diagrama ER como un bloque de código Mermaid en el README de tu proyecto o en un archivo `SCHEMA.md` dedicado. GitHub, GitLab y Notion renderizan Mermaid de forma nativa, por lo que el diagrama se mantiene actualizado con el código. Actualiza el diagrama cada vez que ejecutes una migración, tratándolo como documentación viva en lugar de un artefacto único.