Skip to content
SayDiagramSayDiagram

Getting started

Getting started

Sign in with Google or GitHub, open the dashboard, and create or import your first Mermaid diagram.

On this page3 sections
  1. Sign in
  2. Create your first diagram
  3. What to try next

Sign in

Open /login and continue with Google or GitHub. After you sign in, SayDiagram takes you to the dashboard.

  • Use the same email each time so your library stays attached to one account.
  • Students with a .edu email get Pro free for one year automatically — no coupon required.

Create your first diagram

From the dashboard you can start several ways:

  1. New blank diagram — open the editor with a starter flowchart.
  2. From idea — describe a process in plain language; SayDiagram generates Mermaid.
  3. Image scan — upload a whiteboard photo or sketch to turn it into editable Mermaid.
  4. Import — drag a .mmd, .mermaid, or .md file (Mermaid fences supported) onto the dashboard.

You can also open a template from /templates (or a dedicated page like /templates/flowchart) or follow a Mermaid syntax lesson at /learn (cheatsheets, live previews, and a Check your level quiz), then continue in the editor.

What to try next

  • Edit source in the Monaco pane and watch the live preview update.
  • Switch to Arrange to drag nodes while Mermaid stays in sync.
  • Share a link or copy SVG/PNG into Figma, Penpot, Excalidraw, or Canva.

Learn Mermaid · FAQ · Pricing · Dashboard