Blog

Introducing DiagramaHub: diagrams as code, with AI

DiagramaHub 0.1.0 is out: a Mermaid and PlantUML editor, projects and folders, AI with your own API keys, share links and self-hosting.

Architecture diagrams tend to live as loose images nobody updates: a PNG on the wiki, a screenshot in a ticket, a file only its author can open. The system changes and the diagram falls behind. Today we're shipping DiagramaHub 0.1.0, our first functional release, built to fix exactly that.

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.