ERD Editor

Entity-Relationship Diagram Editor

English | 한국어 | 中文 | 日本語

Design a database schema visually, bring in one you already have from SQL DDL, GraphQL SDL, DBML or AML, and take it out as DDL or as generated code. ERD Editor is one editor and one file format on erd-editor.io, in Google Drive, VS Code, IntelliJ-based IDEs and Obsidian, and in your own page as a custom element, and a coding agent edits the same diagrams through its MCP server.

Where to use it

	Install
Web app	erd-editor.io	Installable PWA that launches offline, real-time collaboration
Google Drive	Google Workspace Marketplace	Adds ERD Editor to Drive's Open with and New menus, saving back to the same file
VS Code	Marketplace	Opens .erd.json files in a custom editor
IntelliJ	JetBrains Marketplace	Same, for IntelliJ-based IDEs
Obsidian	Community plugins	Opens .erd and .erd.json files in a vault tab, desktop only
Your app	npm install @dineug/erd-editor	The framework-free <erd-editor> custom element
Coding agents	@dineug/erd-editor-mcp	An MCP server for Claude Code, Codex or another client, live in VS Code, a JetBrains IDE or Obsidian, or on the file

To try it in an IDE, create an empty file with a .erd.json extension and open it. In Obsidian, run ERD Editor: Create new diagram from Obsidian's command palette. In Google Drive, choose New → More → ERD Editor.

Features

Design

• Visual schema design — tables, columns, memos, and four relationship cardinalities (Zero One, Zero N, One Only, One N)
• Quick edits — Alt+N adds a table and Alt+Enter a column, Alt+K toggles the primary key on the focused column, or on every selected column when it is one of them, and Delete or Backspace removes the selection, each in one undo step; the Shortcuts page of the editor's Settings tab lists every key
• Link existing columns — while you draw a relationship with a mouse or a pen, the buttons beside the table it ends on either map the parent's key onto columns that table already has or add new ones, named after the parent table when the key is one word (user_id for user's id), and Map Columns in a relationship's right-click menu changes its columns later
• Referential actions — set On Delete and On Update (NO ACTION, CASCADE, SET NULL, SET DEFAULT, RESTRICT) from a relationship's right-click menu, which marks one the current database leaves out; the line shows them at its child end as D:C U:R, and View Option's Referential Actions hides the labels. SQL, DBML and AML import read them, and the DDL export and the code generators that have a place for them write the ones the target supports
• Alternate keys — View Option's Alternate Key marks the columns of each unique index over two or more columns as AK1.1, AK1.2, and SQL import reads a UNIQUE over several columns as one such index
• Table groups — draw a box behind related tables, which you name and can color, with New Table Group in the canvas menu or the command palette, or group the selected tables from their right-click menu. A table joins a group when you drop it inside and leaves when you drop it outside, dragging a group by its title moves its tables with it, each member's header takes the group's color, View Option hides the groups, and DBML import and the Code Generator's DBML carry them as TableGroups
• Auto Layout — place every table again by Force, Flow or a vertical or horizontal tree from the canvas menu or the command palette, table groups kept together, in one undo step; Force shows a preview you apply or cancel, and the others land at once
• Copy, paste and colors — copy tables and memos and paste them as new ones, into another diagram too or into a spreadsheet as a grid, hold Alt while dragging to duplicate them, and color a table, memo or table group from its right-click menu
• Clean diffs — the scroll position and zoom, the open tab, the code generator's language and name cases and the bracket type are locked by default, so the file keeps the values they had when locked and looking around never changes it; the file, written in a fixed order, also leaves out measured widths, connector anchors and removed items

Import

• SQL DDL import — bring in a .sql dump from any of the eight vendors below. The parser reads CREATE TABLE, CREATE INDEX, ALTER TABLE constraints and table and column comments (COMMENT ON, SQL Server's sp_addextendedproperty), and skips what it does not recognize, so an awkward dump imports partially rather than failing outright
• GraphQL SDL import — bring in a schema from any tool that emits SDL. Object types become tables, scalars map to the diagram's own dialect, and the fields that point at another type become the relationships; the root types and the wrapper types Relay, Federation and Hasura generate are left out rather than drawn as tables
• DBML import — bring in a .dbml file written for dbdiagram.io or dbdocs.io, or emitted by sql2dbml or prisma-dbml-generator. Tables, columns, indexes, enums, header colors, every Ref spelling and each TableGroup arrive; a Project or a sticky Note is skipped rather than refused
• AML import — bring in an .aml file written for Azimutt, in either the v2 or the legacy v1 spelling. Entities, attributes, indexes, enums, colors and every relation arrow arrive; a check and a struct type are skip