From 88% to 99% valid diagrams

We built a benchmark with 160 cases across 4 models. The chat produced a valid diagram on the first try 88% of the time; with 0.8.1 it reaches 99%. What we fixed:

• The streaming chat — the one the app uses — sent a minimal prompt, without the expected format or any syntax rules.
• Replies were getting cut off at the token limit, because reasoning models spend part of it thinking. A code request now gets 8,192 tokens.
• "Create a flow… (does it need surgery?)" was treated as a question because of the question mark.
• Syntax rules were checked against the real renderers: ASCII identifiers in DBML, valid D2 shapes, PlantUML activity syntax…

The API's /ai/generate-diagram endpoint improves as well: from 72% to 98% valid diagrams.

The diagram always reaches the preview

0.8.2 fixes a really annoying one. The chat guessed from keywords whether your message asked for a diagram or asked a question, and only looked for code in the first case. Requests like "Can you make…?", "I need…" or "Add to it…" were taken as questions: the model did answer with the diagram, but it showed up as text broken into fragments, with no preview and no accept button.

Now the model's reply decides: if it carries a diagram, it's shown with a preview, validated, and you can accept or reject it. Measured with real Gemini calls, 7 out of 7 requests of that kind used to leave the code in the chat; now it's 0 out of 7, across the 4 diagram types. Questions are still answered with text.

flowchart TD
    A[Model reply] --> B{Cut at the limit?}
    B -->|Yes| C[Notice, not applied]
    B -->|No| D{Carries a diagram?}
    D -->|No| E[Text answer]
    D -->|Yes| F{Does it render?}
    F -->|Yes| G[Preview: accept or reject]
    F -->|"No (Mermaid or D2)"| H[Automatic fix, once]
    H --> G

Cut replies and automatic fixes

Every chat reply now gets the 8,192-token cap, and a cut reply is never applied: you see a notice instead of a broken fragment.

There's also an optional automatic fix (Settings → AI, on by default): if generated Mermaid or D2 code doesn't render, the model is asked to fix it, once. It never runs for PlantUML or DBML.

Clear errors and current models

Any provider failure used to look like a "rate limit". DiagramaHub now tells apart invalid key, no credits, model unavailable and rate limit, and "Test connection" makes a real call with the model you picked.

The model catalog is up to date, checked against each provider's docs and with live calls: Claude Sonnet 5.5 / Opus 5.5 / Fable 5.1, OpenAI gpt-6-luna / gpt-6.1-sol / gpt-6-astra, DeepSeek deepseek-flash, Gemini 3.8-flash and MiniMax M3. If you had saved a model that's no longer listed, it keeps working and is marked "retired".

The whole chat in your language

The backend now receives the real interface language (it was always Spanish before). With 0.8.2 the chat is fully available in English — messages, preview card, session selector, phases and errors — and chat and provider errors arrive in the user's language.

Security

0.8.1 also ships security fixes:

• A user could file diagrams under someone else's folder, where they showed up in that folder's explorer tree and export. The folder must now belong to the same project. If you self-host, run scripts.fix_misfiled_diagrams once (it only reports; --apply repairs, without deleting anything).
• Duplicating a diagram respects the plan limit.
• axios 1.20 fixes 12 security advisories (7 high), and the production audit is back to zero.
• Import limits apply to the whole request, not per ZIP.

Try it

Open the chat on any diagram in DiagramaHub Cloud with your own key, or upgrade your instance from the repository. The full details are in the changelog.

Two formats, two uses

When you export a project (or a single folder) you choose between:

• ZIP: one subfolder per project folder, one file per diagram with its language's extension (.mmd, .puml, .d2, .dbml, or .freehand.json for whiteboards), its description in a .md next to it, a README.md index and a manifest.json to import it again.
• A single Markdown file, in two variants:
  • AI context: starts with a preamble that explains the file to the model, and includes an index with paths, each diagram's metadata and a token estimate. Ready to paste into ChatGPT or Claude.
  • Standard: a clean document for your wiki or repository.

Either way, diagrams go in code blocks tagged with their language (mermaid, plantuml, d2, dbml), so any Markdown-aware tool recognizes them.

What the flow looks like

flowchart LR
    A[Project in DiagramaHub] --> B{What do you need it for?}
    B -->|Give an AI context| C[AI-context Markdown]
    B -->|Documentation| D[Standard Markdown]
    B -->|Backup or migration| E[ZIP]
    C --> F[ChatGPT / Claude]
    D --> G[Wiki or README]
    E --> H[Import into another instance]

Before downloading, DiagramaHub shows what will be exported: number of diagrams and folders, size and, for the AI variant, the approximate tokens. You know whether it fits your model's context window before you paste it.

Where to find it

• In the editor's explorer, with the download icon (whole project) or from a folder's menu → Export folder.
• In the projects list.

And back in: import

The other half of the story is bringing diagrams in. From the explorer's upload icon, a folder's menu (Import here) or by dragging files from your computer onto the explorer, you can import:

• Single .mmd, .puml, .d2, .dbml files, Markdown with a code block, and .freehand.json whiteboards.
• ZIPs: DiagramaHub exports restore folders and colors; any other ZIP creates folders from its paths.
• Excalidraw drawings (.excalidraw): shapes, labels, bound arrows, strokes and text become a whiteboard.

Before anything is created you get a preview with the folders and diagrams to be created, skipped files and why, and your plan's quota. Import is all or nothing: if something fails halfway, what was created is rolled back.

The whiteboard now looks hand-drawn

0.8.0 is also the biggest whiteboard update since it arrived:

• Hand-drawn look for shapes, lines and arrows, with stroke styles (Clean, Architect, Artist, Cartoonist) and fills (solid, hachure, cross-hatch).
• Smooth freehand strokes with variable width and pen pressure.
• Handwriting font for new text, with a Handwritten / Regular / Code selector.
• Lock elements (Ctrl/Cmd+Shift+L) so they can't be moved, resized or deleted by accident.
• Export to PNG at 1x, 2x or 3x with an optional transparent background, and download the source as .freehand.json.
• Sketch → Mermaid: shapes with text become nodes and bound arrows become edges of a new flowchart. No AI involved, so the result is exact and repeatable.

Existing drawings keep their clean look; only new elements use the hand-drawn style, switchable per element.

No lock-in

Your diagrams are text, and now they move in and out of DiagramaHub freely. Take a project to your repository, share it with someone on another instance, or give your AI the full map of your system.

Available now on DiagramaHub Cloud and in the self-hosted version. Technical details are in the changelog.

Zero known vulnerabilities in the frontend

The frontend's production dependencies had 25 security advisories, one of them high severity. They're now at zero. We upgraded DOMPurify to 3.4.16 (the library that sanitizes your diagram SVGs), Mermaid to 11.17.2 and react-router to 7.18.4.

We also found something uncomfortable: since the move to pnpm in 0.6.0, the 6 security overrides we force on dependencies were written in npm's format, and pnpm silently ignored them. They now live in pnpm.overrides and apply again.

A non-root backend and capped requests

Two changes for anyone running their own instance:

• The backend container runs as an unprivileged user (app, uid/gid 1000), and the image uses Poetry 2.5.1 (1.8.3 and its dulwich dependency had security advisories).
• A global request size limit: requests with a body larger than MAX_REQUEST_BODY_BYTES (5 MB by default) get a 413, whether the client declares the size or streams the body in chunks.

To upgrade, rebuild the image with docker compose up -d --build. In the development scenario (deploy/local-full), if your Linux user isn't uid 1000, Python won't be able to write its caches to the mounted folder; that's harmless, and the production image isn't affected. If you install dependencies outside Docker, use Poetry 2.

Autosave you can rely on

Two problems weren't obvious at first glance:

• Opening a diagram marked it as modified. The autosave and the zoom/position save fired on load, changing the modification date and reshuffling "Recent". Now it only saves on a real change; panning, zooming or resizing a panel no longer counts as a modification.
• Edits could be lost if you made them right before switching diagrams or leaving the editor, within autosave's 1.5-second wait.

flowchart LR
    A[You edit a diagram] --> B{What happens next?}
    B -->|You wait| C[Autosave]
    B -->|You switch diagrams| D[Saved on switch]
    B -->|You leave or hide the tab| E[Saved on leave]
    B -->|You close with pending changes| F[The browser warns you]

Saves are also sent one at a time, so a slow one can't overwrite a newer edit. And the top bar title no longer shows the previous diagram while the next one loads.

Up to 71% less JavaScript

The whole app used to ship as a single file. Now each page is downloaded on its own:

• Login and the dashboard download 193 KB of JavaScript instead of 668 KB, and show up in ~105 ms and ~130 ms (previously ~165 ms and ~190 ms).
• The editor paints the diagram in ~180 ms (previously ~300 ms).
• The editor is preloaded in the background once you're signed in, so going from the dashboard to a diagram doesn't wait on a download.
• Export loads its libraries only when you export, which keeps the editor lighter.

On the server, the dashboard's "Recent" list now comes from a single indexed query instead of reading every diagram of every project along with its content. The new MongoDB index is created automatically when the backend starts.

Small things that matter

Native browser alerts in AI generation and provider settings were replaced with in-app notices you can dismiss and that follow dark mode. Dates follow the interface language everywhere (PDF/PNG exports, billing, profile, editor), and more strings that were stuck in Spanish are now translated into English.

Upgrade

It's already live on DiagramaHub Cloud. If you self-host, grab the release from the repository and check the upgrade notes in the changelog.

An explorer that works with mouse and keyboard

Every diagram now has an action menu (the ⋯ button or right-click): rename, duplicate, move to a folder, move to another project and delete. Folders get their own: new diagram inside, rename and delete. Empty folders offer a "New diagram here" shortcut.

What you'll notice day to day:

• Inline rename with F2 or double-click, for diagrams and folders.
• Move to a folder without dragging, straight from the menu. It works on mobile too.
• Ctrl/Cmd+B toggles the explorer (inside the description editor it's still bold).
• Pin the panel with the pushpin: it stays open when you click elsewhere and across reloads.
• Keyboard navigation: arrows to move and to open or close folders, Home/End, a single Tab stop, and Shift+F10 to open the row menu.

The explorer also pushes the content instead of covering it, so your code, the preview and the status bar always stay visible. You can resize it between 200 and 480 px (double-click resets it), and DiagramaHub remembers that width and which folders you left open in each project.

It's easier to scan, too: folders first, a badge per diagram type (MMD, PUML, D2, DBML, DRAW), the full title on hover and a result counter while searching ("3 of 24 diagrams"). And search no longer hides matches sitting inside collapsed folders.

Switching diagrams without the flicker

Opening another diagram from the explorer used to make the whole editor vanish while its parts loaded out of step. Now the workspace is covered with a "Loading diagram…" indicator and revealed all at once, with a fade, once the new diagram is drawn.

Along the same lines, creating, moving, renaming or deleting from the explorer no longer reloads the entire editor: the change shows up instantly and, if it fails, it's rolled back with a notice. We also stopped the editor from re-rendering every second because of the status bar clock, and the preview no longer goes blank for a moment on each render.

A production image for the frontend

If you run DiagramaHub on your own infrastructure, this part is for you. The frontend now has a production image: a static site served by Nginx as a non-root user, with security headers, gzip, asset caching and a healthcheck. It weighs 68 MB versus 951 MB for the development image.

The API URL and Sentry settings are injected when the container starts, not when the image is built. One image serves every environment, and it works with DigitalOcean App Platform (Static Site).

flowchart LR
    A[One frontend image] --> B[Container start]
    V["VITE_API_URL, VITE_SENTRY_DSN, VITE_APP_ENV"] --> B
    B --> C[Staging]
    B --> D[Production]

If you use the deploy/external-mongodb scenario, the frontend moves from the Vite dev server to this image. It still listens on port 5173 with the same variables; to change them, just recreate the container. To upgrade, rebuild with docker compose up -d --build. The deploy/local-full scenario is unchanged. There's also a Content-Security-Policy example (csp.conf.example), disabled by default, for you to enable per deployment.

Security: what landed in 0.6.2

A few days earlier we shipped 0.6.2, a hardening release for the API:

• Changing your password requires the current one. A stolen token is no longer enough to take over an account. If you call the API directly, send current_password; if you deploy frontend and backend separately, ship the frontend first.
• CORS restricted to explicit methods and headers, plus a restrictive Content-Security-Policy in production.
• Per-IP limits on registration (20/hour), password reset requests (10/hour), MFA verification (10 per 5 minutes) and the public render endpoint (60/minute), answering 429 with Retry-After.
• A 100,000-character cap on the source accepted by the public render endpoint.
• A complete audit trail: password reset requests, MFA enabled and disabled, and account deletion are now recorded.

On top of that, 0.7.0 makes the AI diagram fixer check that the diagram is yours, and a token from a deleted account now gets a 401 instead of a 500 error.

Try it

Open a project on DiagramaHub Cloud and hit Ctrl/Cmd+B. If you self-host, upgrade from the repository; the full details are in the changelog.

Move a diagram to another project

Sometimes a diagram starts life in the wrong project, or a prototype ends up belonging to a different system. There's now a Move action in the editor toolbar: pick the target project from a picker and you're done.

A couple of details so you know what to expect:

• The diagram lands at the root of the target project. If it was inside a folder, that folder assignment is cleared, and you can file it wherever you like from there.
• The server runs ownership checks before moving anything.

Duplicate in one click

To try a variation without touching the original, use Duplicate from the editor toolbar. The confirmation modal suggests a name based on your language (<name>-copy in English, <name>-copia in Spanish) that you can edit before confirming. The copy opens automatically, already fit to screen and ready to edit.

flowchart LR
    A[Original diagram] -->|Duplicate| B["name-copy"]
    A -->|Move| C[Root of another project]
    B --> D[Opens fit to screen]

A two-step export modal

We reworked the export modal into a two-step flow:

1. Pick a format.
2. Adjust only the options that apply to that format, then hit Export.

That way you don't see controls that have nothing to do with what you're exporting. For example, the new PNG resolution selector only shows up when PNG is selected, with three choices:

• Screen (1x), for something quick.
• Standard (2x), the default.
• High (3x), when you need maximum sharpness.

PDFs that are 5-15x lighter

The image embedded in PDFs switched from lossless PNG to JPEG at quality 0.98, which is visually indistinguishable on diagrams. The result: PDFs are 5 to 15 times lighter. A PDF that used to weigh 20 MB now lands somewhere between 1.5 and 5 MB, much easier to attach to an email or upload to your wiki.

Huge PNGs without the hiccups

For very large diagrams, PNG exports are now capped at 8192 px and downloaded through Blob URLs instead of base64. That removes the encoding overhead and the memory spikes that could make exports sluggish.

Consistent buttons everywhere

We also unified button design: a single pattern for primary and secondary buttons, with a focus ring, disabled state and loading spinner, applied across the whole app. It's a small visual change, but it makes the interface feel more coherent.

Try it

Open a diagram in DiagramaHub Cloud and try Move, Duplicate or a high-resolution PNG export. If you self-host, upgrade to 0.6.1. Technical details are in the changelog.

A new diagram type: the whiteboard

Alongside Mermaid, PlantUML, D2 and DBML, you can now create a Freehand diagram: an Excalidraw-like canvas where you draw directly with:

• Basic shapes: rectangles, diamonds and circles.
• Arrows, lines, text and freehand paths.
• A toolbar with color pickers and stroke width controls.

If you run a self-hosted instance: the canvas state is stored as JSON in the same content field every other diagram uses, so no schema migration is needed.

The best of Miro and Excalidraw

A whiteboard lives or dies by how it feels, so we borrowed what works best in Miro and Excalidraw:

• Undo and redo (Ctrl+Z, Ctrl+Shift+Z or Ctrl+Y) with toolbar buttons and a 100-step history.
• Inline text editing, no browser prompt: multi-line support, text elements that grow as you type, and text inside shapes always centered.
• Keyboard shortcuts for every tool, Ctrl+D to duplicate, arrow keys to nudge and F to fit to content.
• A hand tool and Space+drag panning.
• Align and distribute for multi-selections.
• Group and ungroup (Ctrl+G / Ctrl+Shift+G), with clicks that select the whole group.
• Rotate shapes and text with a handle, snapping to 15° while holding Shift. Connected arrows follow the rotated anchors.
• Miro-style red alignment guides that snap while you drag or draw.
• A contextual style panel right next to your selection.
• A drag-to-erase eraser, dashed lines, start/end arrowheads, rounded corners and font size controls.

Convert between Mermaid, PlantUML, D2 and DBML

Got a Mermaid diagram but your team documents everything in PlantUML? A schema you'd rather have in DBML? You can now convert a diagram to another language using the AI provider you already set up in DiagramaHub (your own API key, just like every other AI feature).

Before anything changes, you see the original and the result side by side, along with warnings about potential incompatibilities between the languages. Conversion is preview-only: nothing is saved until you accept it. Once you do, the diagram is automatically re-centered on screen.

sequenceDiagram
    participant U as You
    participant D as DiagramaHub
    participant AI as Your AI provider
    U->>D: Convert to another language
    D->>AI: Original diagram and target language
    AI-->>D: Converted diagram
    D-->>U: Side-by-side preview with warnings
    U->>D: Accept
    D-->>U: Updated and re-centered diagram

Other changes

• The editor now opens with the folders/files sidebar closed; it shows up when you click the folder icon next to the diagram title.
• For self-hosters: the frontend moved from npm to pnpm for faster installs and better disk efficiency.

Try it

Create a Freehand diagram or convert an existing one in DiagramaHub Cloud. If you self-host, upgrade to 0.6.0. Everything else is in the changelog.

An explorer that stays with you

If you use VS Code, this will feel familiar. The desktop diagram editor now has a persistent project explorer showing your project tree: the diagrams at the root and your folders with their contents. You can open another diagram without leaving the editor and without losing track of where everything lives.

We also fixed a detail that made it awkward to use: interacting with the explorer no longer closes the panel as if you had clicked outside of it.

Organize without leaving the editor

Beyond navigation, the explorer lets you keep your project tidy:

• Create diagrams directly inside a folder, instead of creating them at the root and moving them afterwards.
• Rename folders when the name you picked on day one no longer describes what's inside.
• Move diagrams with drag and drop between the project root and folders.

Folders are still one level deep. That's on purpose: a flat hierarchy stays easy to scan and avoids deep trees where nobody can find anything.

flowchart TD
    P[Project] --> R1[Diagram at the root]
    P --> C1[Backend folder]
    P --> C2[Database folder]
    C1 --> D1[Login sequence]
    C1 --> D2[Service architecture]
    C2 --> D3[DBML schema]
    R1 -. drag and drop .-> C1

Fit to screen, properly centered

Another change you'll notice day to day: fit to screen now frames the diagram using the actual bounds of the rendered SVG. In practice, D2 diagrams are now centered correctly, which wasn't always the case before.

An About page

We added an About page inside the app with product details, a link to the GitHub repository, our X account and a contact email. Whether you want to report something, pitch an idea or just read the code, every path is in one place.

Dependencies, refreshed

This release also updates frontend dependencies, including Mermaid 11.16.0 and DOMPurify 3.4.12, and refreshes transitive dependencies. As a result, npm audit reports 0 vulnerabilities across both production and development dependencies.

Try it

Open any diagram in DiagramaHub Cloud and organize your project from the explorer. If you self-host, upgrade to 0.5.10. Technical details are in the changelog.

SVG: clean vectors for your docs

Starting with 0.5.8 you can download your Mermaid, PlantUML, D2 and DBML diagrams as SVG. Because it's a vector format, it stays sharp at any size, it's small, and it fits right into:

• Documentation and READMEs, where a PNG gets blurry as soon as someone zooms in.
• Vector tools, if you want to keep polishing the diagram by hand for a talk or a poster.

Along with SVG we redesigned the export modal. Formats now show up as a 2×2 grid of cards (PNG, SVG, PDF and Markdown), content options live in a compact secondary section, and the source-code download moved to a subtle button in the footer. Less clutter, same power.

PDFs: from 150–200 MB to ~1–5 MB

Two days earlier, in version 0.5.7, we tackled something you probably noticed if you ever exported a large diagram to PDF: the file weighed 150 to 200 MB. We were capturing an uncompressed bitmap. We switched to high-quality 2x PNG rasterization, and that same PDF now lands around ~1–5 MB.

That release also brought:

• Header and footer on PDF and PNG: the diagram title is always there; project, folder and author are added when you select them. The footer shows the export date.
• Formatted descriptions in PDFs: the description's Markdown is rendered as HTML with headings, bold text, lists and tables instead of raw syntax.
• Richer Markdown exports: the Markdown export includes the diagram description and project metadata when you pick those options.
• Per-format loading state: each button shows its own spinner instead of every button switching to "Exporting" at once.
• Lazy-loaded jsPDF: the PDF library is only downloaded when you need it, so the editor loads faster.

Under the hood, we pulled the export logic out of the editor page into dedicated modules (PDF generator, Markdown exporter, description renderer and metadata header). That cleanup is what let us add SVG without making the code any messier.

How the flow looks

flowchart LR
    A[Your diagram] --> B[Export modal]
    B --> C[PNG]
    B --> D[SVG]
    B --> E[PDF]
    B --> F[Markdown]
    D --> G[README or wiki]
    D --> H[Vector editor]
    E --> I[Share with people outside DiagramaHub]

Security fixes along the way

Between 0.5.5 and 0.5.8 we also shipped security work worth calling out:

• Password changes (0.5.6, critical): when you changed or reset your password, a bug saved the old hash back, so in practice the password didn't actually change. It's fixed. If you changed or reset your password before that release, we recommend doing it again.
• DOM-based XSS (0.5.8): rendered SVG is now sanitized with DOMPurify before it's shown in the preview, the editor and shared diagram views, and Markdown descriptions rendered for PDF/PNG exports are sanitized too.
• Hardened images: the backend moved to an Alpine base image with fewer packages and a smaller CVE surface (0.5.6), and the frontend image now picks up the latest OpenSSL patches (0.5.8). Diagram descriptions are also capped at 50,000 characters (0.5.5).

Try it

Open any diagram in DiagramaHub Cloud, click export and pick SVG. If you self-host, upgrade to 0.5.8. The full technical details are in the changelog.

Streaming responses

Chat responses now arrive progressively through Server-Sent Events (SSE). Instead of a spinner, you see which phase the response is in: "Thinking…", "Analyzing your diagram…", "Generating code…" and "Validating syntax…".

sequenceDiagram
    participant Y as You
    participant C as Chat
    participant P as AI provider
    Y->>C: Ask for a diagram change
    C->>P: Message with the diagram as context
    P-->>C: Response in chunks
    C-->>Y: Live phases and progressive text
    C-->>Y: Validated diagram and diff preview

It works with all five providers: OpenAI, Claude, Gemini, DeepSeek and MiniMax. If a provider doesn't support streaming, the chat automatically falls back to the regular flow, with nothing for you to do.

The chat knows what kind of answer you expect

Not every request is the same, so the chat detects the response mode:

• Code mode: when you ask for a diagram change, you only see the phases, not the model's internal text.
• Text mode: when you ask a question or request an analysis, the text appears as it's generated.

<think> tags from reasoning models (like DeepSeek) are filtered out in real time. If you close the chat panel or switch diagrams, the stream cancels itself. And if something fails, a retry button gives you up to 3 consecutive attempts.

Two more details: when the AI doesn't provide an explanation, you'll no longer see a generic "Diagram modified as requested" message, just the diff preview; and the chat now answers in the language you have active in the app.

Quick actions: one click instead of a prompt

0.5.4 adds four preset actions to the chat:

• Explain: understand what the diagram does.
• Improve UI: polish how it looks.
• Improve Process: review the flow it describes.
• Fix: repair what's broken.

To keep each request in the right place, if you ask for an explanation from the improve modal, DiagramaHub redirects you to the AI chat, where the answer is shown as text.

A chat panel that fits your work

The chat panel is now resizable, and its width is saved per diagram. If one large diagram needs more canvas and another needs room for long explanations, each one remembers your preference.

Security and maintenance

Alongside streaming we added DOMPurify sanitization for server-rendered (Kroki) SVGs, and fixed a side effect that hid node labels in Mermaid. The backend moved to Python 3.12 with an updated Docker base image. If you run your own instance, the admin panel gains "License Usage", "AI Models" and "Last Login" columns.

Try it

Open a diagram on DiagramaHub Cloud, bring up the chat and try Explain or Fix. If you self-host, update from the repository; details are in the changelog.

New navigation

The sidebar is now collapsible and holds navigation, the theme toggle and the language selector. Along with it we reorganized a few things:

• Projects has its own page, with a table view.
• The "AI" section is now called Settings, with a gear icon.
• Logout moved to the Profile page.

The dashboard changed too: a donut chart, an AI usage widget and your recent diagrams, so you can pick up where you left off in one click.

Real dark mode

Dark mode covers the entire app: pages, modals and the editor. For the code editor we added the Kiro Dark Monaco theme, plus a project breadcrumb and a resizable code panel.

DBML: your database schema as code

DBML (Database Markup Language) joins Mermaid, PlantUML and D2. It renders through Kroki on your own infrastructure, just like PlantUML and D2, so your schema never goes to a public service. Here's a simple model:

Table users {
  id integer [pk]
  email varchar [unique]
}

Table diagrams {
  id integer [pk]
  user_id integer [ref: > users.id]
  title varchar
}

Tables, columns and relationships in a handful of lines, versioned right next to your code.

MiniMax and updated models

We added MiniMax as an AI provider, with the same BYOL (Bring Your Own LLM) model as always: you use your own API key. You can pick MiniMax-M2.7 or MiniMax-M2.5.

We also refreshed the catalog with DeepSeek v4 and Gemini 3.1. If a diagram had a saved model that its provider has since retired, DiagramaHub automatically falls back to a current one instead of failing.

A more reliable AI chat

The chat got several improvements you'll notice in long conversations:

• A persistent rolling summary of the session, so the model doesn't lose track.
• A code-first response format, with fallbacks to extract the diagram from the reply.
• <think> tags from reasoning models like DeepSeek and MiniMax no longer show up in the chat.
• The response token limit went from 2048 to 4096.
• Prompts now include Kroki's rendering context.

And the "Fix with AI" button now lives in the code panel and works on render errors too, not just syntax errors. Kroki errors, by the way, are now shown in a readable format.

Polish and security in the patches

The patch releases that followed keep the work going:

• 0.5.1 adds skeleton loading states, guided empty states that point you to the next step, and a mobile-first editor layout: code and description panels in swipeable bottom sheets, a bottom toolbar, and pinch-to-zoom on the diagram.
• 0.5.2 is a security release: we updated frontend dependencies (axios, jspdf, react-router-dom, mermaid and easymde) to resolve critical and high vulnerabilities reported by Snyk, and joined the Snyk Secure Developer Program for Open Source for continuous monitoring.

Try it

Turn on dark mode and create your first DBML diagram on DiagramaHub Cloud, or update your instance from the repository. The full list of changes is in the changelog.

Kroki: your diagrams stay home

Kroki is a diagram rendering engine that runs as one more Docker service (yuzutech/kroki). We added it to all three of the project's Docker Compose configurations, so if you self-host there's nothing extra to install. You point to it with the KROKI_URL environment variable (default http://kroki:8000).

The routing rule is simple:

flowchart LR
    A[Editor] --> B{Diagram type}
    B -->|Mermaid| C[Rendered in your browser]
    B -->|PlantUML or D2| D[DiagramaHub backend]
    D --> E[Self-hosted Kroki]
    E --> F[SVG]

Mermaid is still drawn in your browser. PlantUML and D2 go to your backend, which talks to your Kroki and returns an SVG. No public service ever sees the content.

There's also a new POST /api/v1/diagrams/render endpoint that takes source code and a diagram type and returns the SVG. It works without authentication so that shared diagrams render properly.

D2 joins as a third language

Next to Mermaid and PlantUML, you can now write diagrams in D2, a modern declarative language that reads almost like a list of relationships:

user: User
api: API
db: Database {
  shape: cylinder
}

user -> api: HTTP request
api -> db: query

Support is complete from day one:

• Rendering through Kroki.
• Syntax highlighting in the editor.
• A picker with 19 themes (light, dark and special).
• Syntax validation.
• AI-powered fixes and AI chat support, with full D2 context in the prompts.

In 0.4.1 we fixed an important detail: the "Fix with AI" button failed on D2 and PlantUML because the corrected code contained nested braces that tripped up the response parser. We replaced it with a balanced-braces parser across all four clients (OpenAI, Claude, Gemini and DeepSeek), and OpenAI responses are now forced to valid JSON.

An editor that feels like your IDE

0.4.0 also ships a solid round of UX work:

• IDE-style code editor: dark theme, macOS-style title bar, a file tab with an error indicator, and a status bar showing errors, lines and diagram type.
• Project selector with search, so you can switch projects without leaving the editor.
• Redesigned diagram panel: a floating sidebar with search, quick actions, an active-diagram indicator and the folder hierarchy.
• New "create diagram" modal with a type selector (Mermaid, PlantUML, D2) and a description of each.
• Resizable description panel that remembers its width per diagram.
• Dashboard with a personal greeting and cards for projects, diagrams, last activity and current plan.

On top of that, every view now adapts to mobile and tablet, from the editor to your profile and the shared view.

Polish in 0.4.1

Beyond the "Fix with AI" fix, 0.4.1 gives the login page an animated background and a frosted-glass card, shows the email address your MFA code was sent to, and fully translates the share-diagram modal, with dates formatted for your language.

Try it

Create a D2 diagram on DiagramaHub Cloud or update your instance from the repository: Kroki already ships in the Docker Compose files. Every change is listed in the changelog.

Sign in with Google

You can now sign in with your Google account (OAuth 2.0 / OpenID Connect). Here's how it works:

• If your Google email matches an account you already have, the provider is linked automatically. You keep your projects and there's nothing to migrate.
• If you're new, your account is created on the FREE plan in a single step.
• Your profile lists linked providers and when you linked them.

Google logins skip DiagramaHub's own MFA: the session lasts 5 days and the banner recommending MFA doesn't appear for those sessions.

Under the hood we were careful:

• CSRF protection with server-side state tokens that expire after 10 minutes and clean themselves up.
• ID token validation: signature, issuer, audience and expiration.
• Rate limiting on the callback endpoint and an audit log entry for every OAuth event (successful or failed logins and account linking), in the same security log that already tracked everything else.

The architecture is provider-agnostic: Google is the first one, and each provider plugs in through an adapter class. If you run your own instance, OAuth shows up as an integration in the admin panel that you can turn on or off.

While we were at it, the login and sign-up pages got a language selector in the top-right corner, and the login page now shows the app version.

One chat that detects your intent

The AI chat used to have separate modes for talking and for improving a diagram, and you had to pick one. Now there's a single chat that figures out what you want on its own:

flowchart LR
    A[You type a message] --> B{Detected intent}
    B -->|A question| C[Chats with you]
    B -->|Something new| D[Generates a diagram]
    B -->|Change the current one| E[Improves the existing diagram]

Write the way you'd talk to a teammate: "what's missing in this flow?", "make me a sequence diagram of the checkout" or "add the payments service". The chat decides whether to answer, generate or improve, without you selecting anything.

Also, the provider you choose in a chat session is now saved properly to the diagram's preferences, and DeepSeek works for refinement operations too. Internally we simplified the chat data model and removed the code for the old modes.

AI-generated descriptions

A diagram says a lot, but it doesn't always explain the why. You can now generate a structured Markdown description for any existing diagram and then refine it with the AI until it says what you need. We tuned the prompts so results are consistent, and generation respects the preferred provider you set for that diagram, using your own API keys as always.

A quick follow-up: 0.3.1

The same day we shipped 0.3.1, which fixes a TypeScript compile error that broke the production build. Nothing changes for you as a user, but if you build the image yourself, use this version.

Try it

Sign in to DiagramaHub Cloud with your Google account and open the chat on any diagram. Self-hosting? Update from the repository and enable the OAuth integration in the admin panel. Every change is in the changelog.

Multi-factor authentication

The headline is MFA, with two methods you can enable at the same time:

• Email: we send a code to your inbox, in Spanish or English depending on your account language.
• TOTP app: Google Authenticator, Authy or any compatible app.

With both enabled, you pick a default, and at login you can hit "Try another method" to switch. You also get 8 single-use recovery codes (XXXXX-XXXXX format) for when your main method isn't at hand.

sequenceDiagram
    participant U as You
    participant D as DiagramaHub
    U->>D: Email and password
    D->>U: Asks for second factor
    U->>D: TOTP, email or recovery code
    D->>U: 5-day session

Everything lives under Security in your profile: turn methods on or off, change the default and regenerate codes. If you don't have MFA yet, you'll see a low-key banner after signing in recommending it.

We also changed session length: 2 days without MFA, 5 days with it. Protecting your account means signing in less often, too.

Stronger passwords

The password policy went from 8 to a 12-character minimum, with at least one uppercase letter, one lowercase letter, one digit and one special character, and it can't match your email. Sign-up, change and reset forms now show a real-time strength meter.

In 0.2.1 we added something important: changing your password invalidates every session issued before the change. If you suspect someone got into your account, changing it is enough to kick them out.

Security audit log

0.2.1 introduces an audit log of security events: successful and failed logins, account lockouts, MFA verifications, password changes and resets, recovery code usage and admin MFA resets. Entries are kept for 90 days and then removed automatically.

For instance admins

If you self-host DiagramaHub, there's a new user admin panel: a paginated, searchable list with MFA status, subscription plan, sign-up date and, since 0.2.1, each user's diagram count. You can export it to Excel (.xlsx) and disable MFA for a user who got locked out.

Platform hardening

On the server side we closed a few doors too:

• Login rate limiting: at most 10 attempts per IP per minute.
• Temporary lockout for 15 minutes after 5 consecutive failed attempts.
• HTTP security headers (including HSTS in production).
• In production, Swagger/OpenAPI docs are disabled and 500 errors no longer leak stack traces.

0.2.1 also polishes the MFA flow: the banner no longer shows up after you enable MFA, "Try another method" now shows a selection screen instead of sending an email right away, and unused recovery codes are no longer regenerated when you add a second method.

Turn on MFA

Head to DiagramaHub Cloud, open your profile → Security and enable at least one method. Self-hosting? Update from the repository; every change is listed in the changelog.

Why diagrams as text

Writing a diagram in Mermaid or PlantUML gives you things an image never will: you version it like any other file, review it in a diff, edit it in seconds, and an AI can read and write it. What was missing was a comfortable place to keep them all together, organized and ready to share. That's DiagramaHub.

flowchart LR
    A[You write the code] --> B[Live preview]
    B --> C[Organize in projects and folders]
    C --> D[Share or export]

The editor

• A Monaco editor with syntax highlighting, autocomplete and built-in validation.
• Real-time rendering for Mermaid and PlantUML.
• Per-diagram visual settings: themes, layout engines, styles and curves for Mermaid; themes and skinparam for PlantUML.
• A configurable background (color plus plain, dots or grid pattern), and zoom and position are saved per diagram.
• Full-screen presentation mode with annotations.
• Export to PNG, PDF and Markdown.

Organization

Diagrams live in projects, and each project can hold folders. Navigation is hierarchical: projects → folders → diagrams. Simple, but enough to keep your backend apart from your frontend, or one client apart from another.

AI with your own keys (BYOL)

We don't want to sit between you and your language model. With BYOL (Bring Your Own LLM) you plug in your own API keys for Google Gemini, OpenAI GPT, Anthropic Claude or DeepSeek, and pick the provider and model per diagram. From there you can:

• Generate a diagram from a plain-language description.
• Improve an existing one with suggestions and a diff preview.
• Fix syntax errors, with an explanation and the diff.
• Auto-generate descriptions for your diagrams.
• Iterate step by step in chat sessions, with a searchable, reusable prompt history.

Your keys are stored encrypted in the database and come back masked in API responses. You can test a key before saving it to make sure it works.

Sharing

Any diagram can get share links with a unique token, either public or protected by a 4–20 character access code. Links expire after 5, 10 or 30 days, or never, and you decide whether visitors can copy the source code. Access is rate limited and logged with hashed IPs.

Accounts, plans and languages

• Sign-up, login, password reset with single-use tokens, and account deletion behind a confirmation phrase.
• A plans system with limits on projects and diagrams, a free plan included, and payments through Stripe.
• The interface speaks Spanish (the default) and English, and your profile lets you set time zone, language and avatar.

Host it yourself

DiagramaHub is open source under the Apache 2.0 license. You can deploy it with Docker Compose, with MongoDB bundled or pointing to an external one, and there's a one-line installer (install.sh). It also ships with an initial setup wizard and onboarding for new users. Docs are available in Spanish and English.

Status: beta

This is a 0.x release: the product is in beta and under active development, so some things may change between versions. That's exactly why your feedback matters so much right now.

Try it on DiagramaHub Cloud or deploy it from the GitHub repository. If something doesn't work the way you expect, open an issue: it's the best way to help us shape it.