explaingit

aiunlocked1412/boxbox

24Audience · pm founderComplexity · 2/5LicenseSetup · easy

TLDR

A Claude Code plugin that maps any software project into a clickable visual HTML diagram using three AI agents, it groups features, traces connections, and produces a single shareable offline file in about a minute.

Mindmap

mindmap
  root((boxbox))
    What it does
      Group project features
      Trace connections
      Generate HTML diagram
    Three AI agents
      Feature grouper
      Connection tracer
      Visual renderer
    Output file
      Single HTML file
      Clickable blocks
      Dark and light mode
    Best for
      Next.js projects
      FastAPI projects
      Under 2000 files
Click or tap to explore — scroll the page freely

Code map

Detail Auto

An interactive map of this repo's files and how they connect — its source is parsed live in your browser. Click Visualize to build it.

filefunction / class

Things people build with this

USE CASE 1

Generate a visual map of an unfamiliar codebase as a single HTML file you can open offline or share with non-technical stakeholders.

USE CASE 2

Quickly explain a Next.js, FastAPI, or Django project to a designer, investor, or new team member by running /boxbox and sharing the output.

Tech stack

Claude CodeHTML

Getting it running

Difficulty · easy Time to first run · 5min

Works best on structured projects under 2,000 files, disorganized codebases will produce less useful diagrams.

Use, modify, and distribute freely for any purpose including commercial use, as long as you keep the copyright notice.

In plain English

BoxBox is a plugin for Claude Code, the AI-powered coding tool, that generates a visual diagram of any software project and saves it as a single HTML file you can open in a browser. The diagram is written in plain English and is aimed at people who did not write the code themselves and want to understand how it fits together. When you run the command /boxbox inside a project, three AI agents work through the codebase in sequence. The first scans the files and groups them into features such as login, dashboard, or payments. The second traces the connections between those features, including which parts call external services, which read from a database, and which handle user requests. The third turns that map into a clickable visual layout. The whole process takes roughly a minute. The output is one HTML file at a path called .boxbox/diagram.html. The diagram shows blocks arranged top to bottom, roughly from user-facing pages down through backend logic and into databases and outside services. Clicking any block shows a plain-English description of what that part of the app does. The file works offline and includes a dark and light mode toggle. The intended users are people building apps with AI tools who want a picture they can share with a designer, investor, or new team member. It also works for product managers or founders who need a shared understanding of how a system is structured without reading code. The README notes some limitations. The plugin works best on projects following a common structure, such as Next.js, FastAPI, or Django. Disorganized codebases will produce less useful diagrams. It reads static file structure only, not runtime behavior, and performs best on projects under about 2,000 files. The project is released under the MIT license.

Copy-paste prompts

Prompt 1
I installed aiunlocked1412/boxbox in Claude Code. Walk me through running /boxbox on a FastAPI project and interpreting the blocks shown in the output diagram.
Prompt 2
The boxbox diagram is grouping my project features in unexpected ways. How does it decide what counts as a feature and how can I reorganize my codebase to get a clearer output?
Prompt 3
I want to use boxbox output to walk a non-technical investor through how my app is built. What does the HTML diagram show and what order should I click through the blocks?
Open on GitHub → Explain another repo

← aiunlocked1412 on gitmyhub — every repo by this author, as a profile.

Verify against the repo before relying on details.