Skip to content

Drizzle schema visualizer

Paste Drizzle ORM table definitions and instantly see columns, primary keys, and references as a downloadable ER diagram. Everything runs in your browser.

ER diagram

Paste a Drizzle schema above to generate a diagram.

What is a Drizzle schema diagram?

Drizzle ORM schemas define database tables in TypeScript with dialect-specific builders such as pgTable, mysqlTable, and sqliteTable. A diagram turns those declarations into a visual map of tables, columns, primary keys, and foreign key relationships.

Use the visualizer when reviewing a schema change, onboarding to a Drizzle project, or documenting how tables connect. It reads pasted source text without executing the TypeScript or connecting to a database.

Supported Drizzle schema patterns

The parser handles object-style table definitions, common column builders, chained primaryKey() modifiers, and directreferences(() => table.column) callbacks. Keep the referenced table declarations in the same input so the visualizer can resolve and draw each relationship.

FAQ

Which Drizzle declarations can this visualizer read?

The parser recognizes exported or local pgTable, mysqlTable, and sqliteTable declarations with object-style column definitions. It reads common column builders, SQL column names, chained primaryKey calls, array modifiers, and direct references callbacks. Advanced custom builders and callback-based table configuration may be shown only partially.

Does the visualizer execute pasted TypeScript?

No. The page scans the text for recognizable Drizzle table and column patterns; it never evaluates the code, resolves imports, or runs a build. Parsing and SVG rendering happen entirely in your browser, so the schema is not uploaded to Basedash or sent to another service.

How does the diagram find Drizzle foreign keys?

A relationship is created when a column chains a direct callback such as references(() => users.id). The parser matches the referenced table variable and property to another declaration in the pasted input, then connects the corresponding database columns. Both table declarations must be present for the line to appear.

Are Drizzle relations() definitions included?

The diagram focuses on database-level foreign keys declared with a column references callback. Drizzle relations() helpers describe application query relationships and may exist without a database constraint, so they are not rendered as separate links. Paste the underlying table definitions to visualize the persisted schema accurately.

What can I do with the generated Drizzle diagram?

Use the diagram to review migrations, onboard teammates, check table relationships, or document a project before deployment. The Download SVG action saves a scalable file that can be opened in a browser, added to a pull request, or embedded in technical documentation without losing visual quality.

Go from schema to dashboard

Connect your database to Basedash and build charts from real data.