Visual architecture explorer for Kompo projects.
Inspect your domains, ports, adapters, and dependencies in a browser-based UI.
The Kompo Workbench is a browser-based visual tool that renders your project's hexagonal architecture as an interactive graph. It reads your kompo.config.json and displays:
- Architecture Graph — domains, ports, adapters, and their connections
- Stack Inspector — installed packages and their versions
- Dependency Viewer — cross-package dependency relationships
The workbench is integrated into the Kompo dev server. Add it to your project:
pnpm add -D @kompo/workbenchThen visit http://localhost:<port>/__kompo during development.
git clone https://github.com/kompojs/workbench.git
cd workbench
pnpm install
pnpm dev # Starts on http://localhost:9000pnpm build # Full build (types + Vite)
pnpm build:client # Client IIFE bundle only- React 19 + TypeScript
- @xyflow/react for the architecture graph
- Vite (rolldown-vite) for bundling
- Lucide for icons
- xterm.js for integrated terminal
| Repository | Description |
|---|---|
| kompojs/kompo | CLI, kit, config, core runtime |
| kompojs/blueprints | Blueprint packages |
| kompojs/create-kompo | create-kompo scaffolder |
MIT © 2026 SmarttDev and Kompo contributors