dineug/erd-editor
Design database schemas as ERDs in your browser, VS Code, JetBrains IDEs or Obsidian. Import SQL, DBML and GraphQL, export DDL and code, and let coding agents edit live over MCP.
What it solves
ERD Editor provides a unified, visual environment for designing database schemas. It solves the fragmentation of database modeling by offering a consistent experience across web browsers, IDEs (VS Code, JetBrains), and note-taking apps like Obsidian, while enabling AI coding agents to participate in the design process.
How it works
It uses a single .erd.json file format to represent database schemas. The project includes a core custom element (<erd-editor>) that renders the visual diagram. For AI integration, it provides an MCP (Model Context Protocol) server that allows coding agents like Claude Code or Codex to read, modify, and collaborate on the schema directly within the editor's canvas.
Who it’s for
It is for developers and database architects who need to design, visualize, or modify database schemas and want to integrate those workflows into their existing IDEs or leverage AI agents to automate schema updates.
Highlights
- Multi-platform support: Works as a web app, VS Code/JetBrains extension, Obsidian plugin, and Google Drive app.
- AI-Ready: Includes an MCP server that allows AI agents to act as collaborators, making edits directly to the visual schema.
- Extensive Import/Export: Supports importing SQL DDL, GraphQL SDL, and DBML, with exports for 8 database types and 22 programming languages/ORMs.
- Real-time Collaboration: Features WebRTC-based, encrypted live sessions for team editing.
- Embeddable: Provides a custom element (
<erd-editor>) for developers to embed the modeling tool into their own applications.
Related
- Project
- Project
- Project
- Project