arch-viz

Convert source code repositories into architecture diagrams and data graphs.

Updated May 28, 2026
One-click install
npx skills add https://github.com/SensLiao/Claude-code-setting --skill arch-viz
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: arch-viz
Source: https://github.com/SensLiao/Claude-code-setting/tree/main/skills/arch-viz
Command: npx skills add https://github.com/SensLiao/Claude-code-setting --skill arch-viz

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires arch-viz, and includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill turns complex codebase architectures into presentable, committable artifacts, facilitating understanding and documentation of software structures.

Core Features & Use Cases

  • Visualize Architecture: Creates interactive offline viewers and agent-readable graphs of a codebase's architecture.
  • Committable Artifacts: Generates graph.json, viz/index.html, architecture.svg, and ARCHITECTURE.md for integration into documentation.
  • Use Case: For software architects, developers, or teams working on large codebases, arch-viz provides a means to document and communicate architecture with clients and peers.

Quick Start

Scan the current codebase with arch-viz and add the architecture to your project using arch-viz scan.

Frequently Asked Questions about arch-viz

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I generate an architecture diagram from my source code repository?

To generate an architecture diagram from a source code repository, you scan the codebase to normalize structural data into JSON, SVG, and Markdown. This produces committable artifacts like viz/index.html and ARCHITECTURE.md for documentation.

What is the best way to document a codebase architecture for clients and peers?

The best way to document a codebase architecture is to generate committable artifacts like graph.json, an interactive offline HTML viewer, architecture.svg, and ARCHITECTURE.md. These files integrate directly into repository documentation for peers and clients.

Can I create an interactive offline viewer for my software visualization?

Yes, you can create an interactive offline viewer for software visualization. The process generates a viz/index.html file that provides an interactive, offline-capable view of your codebase architecture and detailed data graphs.

Does arch-viz work with local code graphs for repository documentation?

Yes, arch-viz works with a local CodeGraph to analyze and normalize repository data. It utilizes this local code graph structure to extract data and convert it into committable architecture diagrams and detailed data graphs.

How do I add a code graph to my project using arch-viz?

To add a code graph to your project, run the arch-viz scan command on your current codebase. This scans the repository and generates the architecture artifacts, allowing you to commit the visualization directly into your documentation.

What formats are generated when visualizing codebase architecture into committable artifacts?

When visualizing codebase architecture into committable artifacts, the process generates graph.json, viz/index.html, architecture.svg, and ARCHITECTURE.md. These formats provide both agent-readable graphs and human-presentable documentation.