ERD Browser

VS Code extension for browsing and editing large ERD models authored in dbml/dbdiagram text.

Features

• Render dbml tables and relations in an interactive webview using a D3 force-directed layout.

• Add, edit, and delete tables, fields, and references directly from the diagram surface.

• Filter the diagram by schema and tag, with an option to include directly connected tables.

• Undo/redo history with a dedicated history panel.

• Per-table color overrides and persistent drag-to-position layout via in-file @erd directives, e.g.

  // @erd table=users color=#2563eb borderColor=#1d4ed8 textColor=#ffffff x=120 y=180
  

Commands

• ERD: Open Diagram View (erd.openErdView)
• ERD: Undo (erd.undo)
• ERD: Redo (erd.redo)

Getting started

1. Install the extension from the VS Code Marketplace.
2. Open a .dbml file.
3. Run ERD: Open Diagram View from the Command Palette.

License

MIT