Visualize the semantic vocabulary of a .NET solution as a leveled composition graph.

Arcana transforms a .NET codebase into a vocabulary—a visual map showing how primitive types compose into domain abstractions. Think of it as an X-ray of your solution's conceptual architecture.

The model:

The insight: Scrolling up through levels reveals how low-level concepts combine into domain abstractions. The vocabulary graph exposes the conceptual architecture of your solution.

• .NET 10 SDK
• Node.js 20+
• Yarn 4+

cd cli

# Analyze a .NET solution
dotnet run --project src/Arcana.Cli -- "path/to/Your.sln" -o vocabulary.json

# With statistics
dotnet run --project src/Arcana.Cli -- "path/to/Your.sln" -o vocabulary.json --stats

The CLI accepts:

• A .sln file directly
• A .csproj file
• A folder containing either (auto-discovers)

# Install dependencies (from repo root)
yarn install

# Build all packages
yarn build

# Start the development server
cd packages/app
yarn dev

Open http://localhost:5173, then drag-and-drop your vocabulary.json file onto the page.

Interaction:

• Scroll/pinch to zoom
• Click and drag to pan
• Hover over a word to highlight its composition edges
• Click a word to add it to the current phrase—the visualization clusters phrase members and dims unrelated nodes
• Search to filter words by name

Click any word to explore its compositional structure. The visualization clusters all transitive dependencies of the selected word(s), pushing unrelated types aside. This makes it easy to trace how a high-level abstraction is composed from lower-level building blocks.

Click additional words to extend the phrase, or use the Clear button in the details panel to return to the full vocabulary view.

┌─────────────────┐         ┌─────────────────┐
│   CLI (C#)      │         │   SPA (TS)      │
│                 │  JSON   │                 │
│  Roslyn spider  │────────▶│  D3 level-scroll│
│  → vocabulary   │         │  visualization  │
│  → levels       │         │                 │
└─────────────────┘         └─────────────────┘

{
  "words": [
    {
      "id": "MyApp.UserId",
      "name": "UserId",
      "kind": "user",
      "level": 1,
      "composedOf": ["System.Int32"]
    },
    {
      "id": "MyApp.User",
      "name": "User",
      "kind": "user",
      "level": 2,
      "composedOf": ["MyApp.UserId", "System.String"]
    }
  ],
  "metadata": {
    "source": "/path/to/solution",
    "extracted": "2026-02-04T10:30:00Z"
  }
}

arcana/
├── cli/                  # C# CLI - Roslyn analyzer
│   └── src/
│       ├── Arcana.Cli/
│       ├── Arcana.Extraction/
│       ├── Arcana.Levels/
│       └── Arcana.Vocabulary/
├── packages/             # TypeScript SPA
│   ├── app/              # Main application
│   ├── levels/           # Level computation
│   ├── phrase/           # Vocabulary filtering
│   ├── viz/              # D3 visualization
│   └── vocabulary/       # Core model
├── guidelines/           # Development guidelines
├── prompts/              # Agent prompt templates
└── proposals/            # Feature proposals

cd cli
dotnet build           # Debug build
dotnet build -c Release # Release build
dotnet test            # Run tests

# From repo root
yarn install           # Install dependencies
yarn build             # Build all packages
yarn test              # Run tests

Visualization: D3.js with vertical stack layout. Each level is a horizontal row; zoom and pan to navigate. Edges connect words to their compositions in lower levels.

Generics: Open generic types (List<>, Dictionary<,>) are words at level 0. Closed constructed types (List<User>) are compositions of the open type + its type arguments. This reveals how generic templates get instantiated across the codebase.

Cycle Handling: Uses Tarjan's algorithm for strongly connected components. Types in a cycle share the same level.