Visualize SQL joins and table lineage directly inside VS Code. Select any query and instantly see how tables connect, what columns flow through, and where the output comes from.
Features
Instant graph — select SQL in any editor, run one command, see the lineage
JOIN type coloring — INNER, LEFT, RIGHT, FULL, and CROSS joins are each color-coded
Column lineage — trace which columns come from which tables
Embedded in VS Code — opens in a side panel, no browser required
Dark & light theme — follows your VS Code color theme automatically
Persistent panel — the graph stays open when you switch files
Supported SQL patterns
Pattern
Status
SELECT with any number of JOINs
Supported
Common Table Expressions (WITH)
Supported
Nested subqueries
Supported
CREATE TABLE … AS SELECT
Supported
CREATE VIEW … AS SELECT
Supported
INSERT INTO … SELECT
Supported
UNION / INTERSECT / EXCEPT
Planned
Unsupported or ambiguous statements produce a partial or empty graph instead of failing silently.
Usage
From the Command Palette (Ctrl+Shift+P / Cmd+Shift+P):
Command
Description
Joinscape: Open Visualizer
Open the panel (empty)
Joinscape: Visualize Selection
Visualize selected text
Joinscape: Visualize Document
Visualize the full active file
Joinscape: Paste SQL
Enter SQL via an input box
Joinscape: Clear
Clear the current graph
From the editor title bar — icons appear contextually:
The selection button shows when text is selected
The document button shows in .sql files
From the right-click menu — select SQL text and choose Joinscape: Visualize Selection.
Installation
Search for Joinscape in the VS Code Extensions panel (Ctrl+Shift+X), or install from the Marketplace page.
Contributing
Contributions are welcome. See CONTRIBUTING.md for setup instructions, project structure, and the PR process.