ArchiGram.ai is an AI-powered architecture diagramming tool that transforms natural language descriptions into production-ready diagrams. Stop dragging boxes — start describing systems.
Input: "Create a microservices architecture with API gateway,
user service, order service, Redis cache, and PostgreSQL"
Output: Complete Mermaid.js diagram in 2 seconds
| Mode | Backend | What Works |
|---|---|---|
| Hosted (archigram-ai.vercel.app) | Supabase | Full: AI, community gallery, publish, like, fork |
| Self-hosted minimal | None | AI (Gemini key), diagramming, export, share URL, static gallery |
| Self-hosted full | Supabase | Same as hosted; your infra, your data |
No vendor lock-in. Start with the hosted version, self-host when you need data sovereignty.
| You are... | You want... |
|---|---|
| Architects | Local diagramming, AI, export — run locally with Gemini key |
| Teams | Shared gallery, publish, fork — use hosted or self-host with Supabase |
| Enterprises | Data sovereignty, RAG — self-host + optional RAG backend |
Describe your system in plain English. Gemini 3 Flash generates valid Mermaid.js code instantly.
Scan whiteboard sketches, screenshots, or hand-drawn diagrams. AI converts them to editable code.
AI analyzes your diagrams for:
- Single points of failure
- Security vulnerabilities
- Scalability bottlenecks
- Missing components
- Mermaid.js: Flowcharts, sequence, class, state, ER, Gantt, and more
- PlantUML: Enterprise-standard UML diagrams
- BPMN: Business process modeling
Every user gets a shareable profile at archigram-ai.vercel.app/u/username — avatar, bio, social link, and a grid of published diagrams. Full OpenGraph metadata for social sharing.
Browse, like, fork, and share diagrams with the community.
- Export as SVG or high-resolution PNG
- Share via compressed URLs
- Copy for Platform — one-click copy formatted for GitHub, Notion, GitLab, VS Code, Obsidian, Confluence
- Mermaid renders natively in these platforms — no embed widget needed
Visit archigram-ai.vercel.app — no installation required.
git clone https://github.com/isatimur/archigram.ai.git
cd archigram.ai
bun install
cp .env.example .env
# Add GEMINI_API_KEY only (see .env.example)
bun run devOpen http://localhost:3000. Community gallery shows static fallback.
Same as Option 2, but add NEXT_PUBLIC_SUPABASE_URL and NEXT_PUBLIC_SUPABASE_KEY to .env for live gallery. See DEVELOPMENT.md.
# Use hosted API (no key needed)
bun run cli "describe a microservices auth flow"
# Or use local Gemini key
GEMINI_API_KEY=your_key bun run cli "create a sequence diagram for user login"Use ArchiGram from Cursor, Claude Desktop, or any MCP client. Exposes generate_diagram and get_diagram tools.
bun run mcp-serverAdd to your MCP config (e.g. Cursor .cursor/mcp.json or Claude claude_desktop_config.json):
{
"mcpServers": {
"archigram": {
"command": "bun",
"args": ["run", "mcp-server", "--cwd", "/path/to/archigram.ai"]
}
}
}Uses hosted API by default; set GEMINI_API_KEY for local generation.
| Technology | Purpose |
|---|---|
| React 19 | UI Framework |
| TypeScript | Type Safety |
| Next.js 15 | Build Tool & SSR |
| Tailwind CSS | Styling |
| Google Gemini | AI Generation |
| Mermaid.js | Diagram Rendering |
| Supabase | Community Database |
| Vercel | Hosting |
- Development Guide - Set up your local environment
- Architecture - Technical architecture overview
- Product Vision - Strategic vision, JTBD, competitive positioning
- Contributing - How to contribute
- Changelog - Version history
- Security Policy - Report vulnerabilities
"Design a real-time chat application with WebSocket server,
message queue, presence service, and MongoDB"
"AWS architecture with ALB, ECS Fargate, RDS Aurora,
ElastiCache, and S3 for static assets"
"ML training pipeline with data ingestion, feature store,
model training on GPU, experiment tracking, and model registry"
"E-commerce microservices: API gateway, product catalog,
inventory, cart, checkout, payment processing, notifications"
- AI diagram generation
- Vision AI (image to diagram)
- Architectural audit
- Community gallery
- PlantUML support
- BPMN editor
- Copy for Platform (GitHub, Notion, GitLab, VS Code)
- C4 model templates
- REST API (
POST /api/v1/generate,GET /api/v1/diagrams/:id) - CLI tool (
bun run cli "describe auth flow") - Dynamic OG images for link previews
- User authentication
- Real-time collaboration
- GitHub integration
- Team workspaces
- MCP server for AI agent integration
See PRODUCT_VISION.md for the strategic vision and phased roadmap. Open issues for proposed features.
We love contributions! See CONTRIBUTING.md for how to get started.
Looking to contribute? Check out issues labeled good first issue or help wanted.
- Fork the repository
- Create your feature branch (
git checkout -b feature/amazing-feature) - Commit your changes (
git commit -m 'feat: add amazing feature') - Push to the branch (
git push origin feature/amazing-feature) - Open a Pull Request
- GitHub Discussions - Ask questions, share ideas
- Twitter - Follow for updates
- Discord - Join the community (coming soon)
If ArchiGram.ai helps you, consider supporting its development:
Distributed under the MIT License. See LICENSE for more information.
- Mermaid.js - The incredible diagramming library
- Google Gemini - AI that powers our generation
- Supabase - Backend infrastructure
- Vercel - Hosting platform
- All our contributors
If ArchiGram.ai helps you, please give it a star!
Made with love by Timur Isachenko and contributors