VS Code Extension

The dbdiagram VS Code extension brings DBML editing support and a live ERD preview into your editor, so you can work on database designs without leaving your coding workflow.

Supported editors

• VS Code: install from the VS Code Marketplace
• Cursor / Windsurf / other Open VSX-based editors: install from the Open VSX Registry

What you can do with the extension

• ERD visualization: render an Entity-Relationship Diagram (ERD) directly from .dbml files.
• DBML editor support: syntax highlighting and editing support for DBML.
• Generate DBML from a database connection: connect to a database and generate DBML to visualize an existing schema.

info

Using paid features in the VS Code extension

If you're on a paid plan (Personal Pro, Team, etc.), you can log in to dbdiagram.io within the extension to access premium features. You can log in via:

• Command Palette: Open the command palette (Cmd+Shift+P on macOS or Ctrl+Shift+P on Windows/Linux) and search for "Login with dbdiagram"
• VS Code accounts menu: Click the account icon in the bottom left corner of VS Code, then select "Sign in with dbdiagram to use dbdiagram"

Network connectivity is required to access paid features.

Feature comparison vs dbdiagram.io (cloud version)

Feature	Cloud	VS Code extension
Table groups	✅	✅
Custom colors for tables, groups, refs	✅	✅
Diagram views	✅	❌
Sharing & collaboration	Cloud-based: share diagrams via links, invite collaborators, shared workspace, real-time collaboration	Git-based: collaborate by version-controlling .dbml files in your repository
Diagram privacy	Cloud-based: control access with private diagrams, password protection, and invite-only access	Git-based: control access via repository permissions
AI Assistant	Built-in AI assistant	Use your IDE's AI agent (e.g. to edit DBML)

Roadmap

We're working on bringing key cloud capabilities into the VS Code extension while keeping a smooth "code-first" workflow:

1. Diagram views in code (target: Q1 2026) – let you define and manage diagram views as code alongside your DBML, so you can create and switch views directly inside the IDE.
2. GitHub Integration (backlog) – allow you to link diagrams between dbdiagram.io and your GitHub repositories so you can work in either the cloud or IDE without losing cloud-based sharing and collaboration.