Saltar al contenido

Generador de diagramas de flujo

Describa un proceso con una cadena de pasos por línea y obtenga un diagrama de flujo junto con el código Mermaid que lo genera.

Procesado localmente en tu navegador

Opciones
Una cadena por línea con "->". Etiquete una flecha con "-texto->". O pegue código Mermaid que empiece por "flowchart".0 caracteres · 0 líneas
El resultado aparecerá aquí.

¿Qué es Generador de diagramas de flujo?

Un diagrama de flujo muestra los pasos de un proceso y las decisiones que lo bifurcan. Esta herramienta ofrece dos formas de crearlo: escribir un esquema sencillo con flechas ("Inicio -> Comprobar -> ¿Válido? -sí-> Guardar") o pegar código Mermaid completo para tener control total.

En modo esquema cada línea es una cadena de pasos. Las etiquetas idénticas reutilizan el mismo nodo, una etiqueta que termina en "?" se convierte en un rombo de decisión, Inicio y Fin pasan a ser terminales redondeados y "-sí->" coloca una etiqueta sobre la flecha. El código Mermaid generado aparece junto al diagrama para que pueda copiarlo y refinarlo.

¿Cómo funciona?

  1. Escriba una cadena por línea, uniendo los pasos con "->" y etiquetando una flecha con "-texto->".
  2. Elija la dirección (arriba-abajo, izquierda-derecha, abajo-arriba, derecha-izquierda) y un tema.
  3. Revise el diagrama y el panel "Código Mermaid"; pegue su propio código Mermaid en cualquier momento.
  4. Exporte el diagrama como SVG o PNG, o copie el código Mermaid.

Casos de uso habituales

  • Documentar un proceso de registro, aprobación o escalado de soporte.
  • Explicar un algoritmo o una regla de negocio con ramas de decisión.
  • Convertir notas de una reunión sobre un flujo de trabajo en una imagen compartible.
  • Obtener rápido un primer borrador en Mermaid y refinarlo después en el editor.

Ejemplos

Prueba esta entrada en la herramienta de arriba:

Start -> Check input -> Valid? -yes-> Save record -> Send confirmation -> End
Valid? -no-> Show error message -> Check input

Privacidad

Generador de diagramas de flujo se ejecuta por completo en tu navegador. El texto o los archivos que proporcionas se procesan en tu dispositivo y no se suben, registran ni almacenan en nuestros servidores.

Limitaciones

El modo esquema solo cubre nodos, decisiones y flechas con etiqueta. Los subgrafos, los estilos personalizados y otras funciones avanzadas requieren código Mermaid. Separe las ramas de una decisión repitiendo su etiqueta en otra línea.

Preguntas frecuentes

¿Cómo dibujo una decisión con ramas sí y no?

Termine la etiqueta con un signo de interrogación y escriba una línea por rama: "¿Válido? -sí-> Guardar" y "¿Válido? -no-> Mostrar error". Ambas líneas comparten el mismo rombo.

¿Qué hace la opción de dirección con mi código?

Solo reescribe la primera línea ("flowchart TD" pasa a "flowchart LR", por ejemplo). Elija "Mantener la del código" para respetar una dirección que usted escribió.

¿Puedo pegar código Mermaid en lugar de un esquema?

Sí. Si el texto empieza con una palabra clave de Mermaid como flowchart o graph, se renderiza tal cual, aplicando solo la dirección y el tema opcionales.

Más herramientas en Markdown y diagramas →