Skip to content
| Marketplace
Sign in
Visual Studio Code>Visualization>ERD Visual EditorNew to Visual Studio Code? Get it now.
ERD Visual Editor

ERD Visual Editor

Al Graham

|
9 installs
| (0) | Free
Visual ERD editor with version control support for team collaboration
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

ERD Visual Editor

Visual Entity Relationship Diagram editor for VS Code with drag-and-drop editing and SQL export.

Getting Started

Create a New ERD

  1. Command Palette: Press Ctrl+Shift+P and run "ERD: Create New ERD File"
  2. Manual: Create any file ending in .erd.json (e.g., myproject.erd.json)

Open an Existing ERD

Simply open any .erd.json file - it will automatically open in the visual editor.

Usage

  • Add Entity: Click "+ Entity" in the toolbar
  • Move Entities: Drag them around the canvas
  • Create Relationships: Drag from one field to another
  • Edit Properties: Click an entity to see its properties panel
  • Export SQL: Click "Export SQL" to generate DDL

File Format

ERD files are JSON-based for easy version control and team collaboration.

  • Contact us
  • Jobs
  • Privacy
  • Manage cookies
  • Terms of use
  • Trademarks
© 2025 Microsoft