Show HN: How to Use Mermaid Chart as an AI Diagram Generator for Developers

Show HN: How to Use Mermaid Chart as an AI Diagram Generator for Developers


“Create a flowchart showing the purchase request process, from employee submission to manager approval, finance review, and final purchase.” “Build a Gantt chart for a 6-month software development project with phases: Planning, Design, Development, Testing, and Deployment.” “Create an org chart for a company with a CEO, a CTO with two dev teams, a CFO with one accountant, and a COO with HR and Operations managers.” “Generate a sequence diagram for a user logging in through a web application, including steps for frontend, backend API, and authentication server.” “Create a state diagram for a delivery package from ‘Ordered’ to ‘Delivered’, including states like ‘Packed’, ‘Shipped’, ‘Out for Delivery’, and ‘Failed Delivery’.” Add the nodes “Continue and Evaluate” after the [node name] node Highlight the node “Continue” with an orange background with white text Add a new node “Option 4″ and create a link from Evaluate to it Change the node Start to a circle shape Add an edge from Start to Evaluate Conditions, loops, or logic paths Example Prompt: “Use the AI diagram generator to create a user journey diagram from onboarding to retention, showing decision points for churn and engagement.” Tip: Think like you’re describing the diagram to a colleague, the more context the AI has, the better your first output will be.

Author: msfi


Published at: 2025-05-21 21:10:02

Still want to read the full version? Full article