Obsidian Stats logoObsidian Stats

DBML Visualizer

by Mayeenul Islam
5
4
3
2
1
Score: 35/100
New Plugin
Install Code

Description

This plugin has not been manually reviewed by Obsidian staff. Renders modified DBML code blocks into interactive Entity Relationship Diagrams (ERDs).

Reviews

No reviews yet.

Stats

stars
15
downloads
0
forks
0
days
NaN
days
NaN
days
0
total PRs
0
open PRs
0
closed PRs
0
merged PRs
0
total issues
0
open issues
0
closed issues
0
commits

Latest Version

Invalid date

Changelog

See all version on GitHub

README file from

Github

DBML Visualizer

Renders DBML code blocks into interactive ERD diagrams inside Obsidian.

Overview

DBML Visualizer converts dbml fenced code blocks into an interactive, pannable and zoomable ERD (Entity Relationship Diagram). Tables rendered from DBML can be dragged for custom layout; relations are drawn between columns.

Obsidian DBML Visualizer by Mayeenul Islam

Key features:

  • Render dbml/DBML code blocks to SVG ERDs
  • Automatic layout with link lines and arrowheads
  • Pan, zoom, and drag table nodes
  • Optional title metadata via code fence info string

Installation

Two ways to install:

  • Community Plugins (recommended): Install via Obsidian's Community Plugins interface.

  • Manual (for testing):

    1. Download main.js and manifest.json from a GitHub Release.
    2. In your vault, copy the folder to .obsidian/plugins/obsidian-dbml-visualizer/.
    3. Enable the plugin in Obsidian's Settings → Community plugins.

Usage

Add a fenced code block with language dbml in a note. Example:

or,

You can pass title in the fence info string:

Notes:

  • Use users.id <> orders.user_id style relations (supports >, <, <>).
  • The plugin registers processors for both dbml and DBML fences.

Development

Requirements:

  • Node.js (recommended v16+ or v18+)

Common commands (from the plugin root):

npm ci
npm run dev    # build with inline sourcemaps (development)
npm run build  # production build (runs esbuild with 'production' flag)

Built output: main.js (bundle produced by esbuild).

About the author

Mayeenul Islam https://mayeenulislam.github.io/

The plugin was vibe-coded using free AI models with the knowledge of building BŪNŌN.

BŪNŌN — DBML ER Diagram visualizer https://mayeenulislam.github.io/bunon/

License

This plugin is licensed under the MIT License — see LICENSE.

Sponsors