karasu for VS Code

Author and explore karasu architecture models (.krs / .krs.style) without leaving your editor. karasu is a text-based architecture modeling tool — inspired by the C4 model but with its own vocabulary — that keeps the logical and physical structure of a system separate.

This extension gives .krs files syntax highlighting, inline diagnostics, and a live SVG preview you can drill into.

Features

• Syntax highlighting for .krs and .krs.style files.
• Inline diagnostics — errors and warnings from the karasu language server, shown as you type.
• Live preview — the same preview as the web app, beside your source: drill into containers, pan and zoom, switch between the System, Deploy, Org and CRUD views, highlight facets, collapse groups, and hover an edge to trace it. Unsaved edits show up as you type, in the open file and in the files it imports.
• Bidirectional jump — Cmd/Ctrl+Click a node in the preview to jump to its definition, even in another file; the cursor in the editor highlights the node it is on.
• Standard editor smarts — hover and go-to-definition over your model.
• Node and edge detail panels — inspect a node or an edge and jump across diagrams.
• Edge direction from the preview — right-click an edge to set its direction; the rule is written into the style sheet's editor (an @import is added when there is none), unsaved, so the editor's undo takes it back.

Screenshots

Edit .krs on the left, explore the live preview on the right:

karasu separates a system into three faces — switch between them with the preview's tabs:

Getting started

1. Install the extension (see below).

2. Create a file ending in .krs, for example index.krs:

   system Shop {
     service Web "Storefront" [web]
     service Api "Orders API"
     Web -> Api "places order"
   }
   

3. Run karasu: Open Preview from the editor title bar (or the command palette) to see the rendered diagram. Edits update the preview live.

For the full .krs / .krs.style syntax, see the syntax reference and the sample models. The complete documentation lives on the karasu docs site, and you can try karasu straight from your browser at karasu.kompiro.dev.

Installation

From the Extensions view, search for karasu, or from the command line:

code --install-extension karasu-tools.karasu-vscode

The Marketplace listing goes live with the karasu launch — if the link or command above is not yet available, the extension is still being published.

Scope

The extension is intentionally a convenience for editing .krs locally; features such as completion, code actions, and rename are still minimal. For a fuller authoring experience, the web preview (karasu serve) or the hosted app is recommended. See the project README for the CLI.

Feedback

Issues and ideas are welcome at github.com/kompiro/karasu/issues.

Licensed under Apache-2.0.