skills.rest
Ven0m0
Ven0m0COMMUNITY
Explore all skills by this author →
WebsiteGitHub

codebase-visualizer

Generates an interactive HTML tree view of a codebase with file sizes and types.

6|1|Updated Jan 21, 2026
Search Tags:#code analysis#project structure#codebase#visualization#tree view#file explorer
One-click install
npx skills add https://github.com/Ven0m0/claude-config --skill codebase-visualizer-ven0m0
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: codebase-visualizer
Source: https://github.com/Ven0m0/claude-config/tree/main/claude/skills/codebase-visualizer
Command: npx skills add https://github.com/Ven0m0/claude-config --skill codebase-visualizer-ven0m0

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) components.

What problem does it solve?

This Skill helps users understand the structure and size distribution of their codebase, especially when exploring new projects or identifying areas for optimization.

Core Features & Use Cases

  • Interactive Tree View: Generates an HTML visualization of the project's file and directory structure.
  • Collapsible Directories: Allows users to expand or collapse folders to focus on specific parts of the codebase.
  • File Size Information: Displays the size of individual files and aggregate sizes for directories.
  • File Type Breakdown: Shows a summary of different file types and their contribution to the total size.
  • Use Case: When onboarding a new developer to a large project, use this Skill to quickly generate a visual map of the entire repository, allowing them to grasp the overall architecture and identify key modules.

Quick Start

Run the visualization script from your project root to generate an interactive HTML tree view of your codebase.

Frequently Asked Questions about codebase-visualizer

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

FAQPage Schema
How do I visualize my project structure as an interactive tree?▼

You can visualize project structure by running a Python 3 script from your repository root to generate an interactive, collapsible HTML tree view. This HTML file displays your codebase directories, individual file sizes, and file type breakdowns for exploration.

What is the best way to explore a new codebase and identify large files?▼

To explore a new codebase and identify large files, generate an interactive HTML tree visualization. This provides a collapsible directory view that displays individual file sizes and aggregate directory sizes, helping you quickly grasp the architecture and spot heavy files.

Do I need any external dependencies to generate a codebase file explorer?▼

No external dependencies are required to generate this codebase file explorer. The Skill relies entirely on Python 3 and its standard libraries for file system traversal and HTML generation, requiring no additional package installations.

Can I see a file type breakdown when visualizing my repository?▼

Yes, you can see a file type breakdown when visualizing your repository. The generated HTML tree includes a summary showing different file types and their total contribution to the overall project size, alongside the interactive directory structure.

Does the codebase visualization support collapsing directories?▼

Yes, the codebase visualization supports collapsing directories. The generated HTML tree allows users to expand or collapse specific folders, enabling them to focus on targeted parts of the project structure without being overwhelmed by the entire file system.

Related Skills

Explore More Software Engineering Skills→
pingmepipingmepi

pm-sync

Synchronize telemetry.jsonl and feedback.jsonl files to a central repository with hash chain integrity verification.

Community
Intermediate
jieni777jieni777
1

bundle-checker

Analyze project dependencies and build configuration to identify bundle size issues.

Community
Intermediate
tsuna44tsuna44

xddp.codemap

Generate module catalogs with symbol indices and dependency graphs for software repositories.

Community
Intermediate
Chengxufeng1994Chengxufeng1994

codebase-visualizer

Generate an interactive HTML tree visualization of a codebase with file sizes.

Community
Basic