Summary
This turns GitHub profiles into 3D pixel art buildings where your contribution count sets the height, repo count determines width, and stars control window brightness. Built with Next.js, React Three Fiber, and Supabase, it uses instanced rendering to handle lots of buildings without killing performance. The code shows how to map GitHub GraphQL API data to building metrics, set up instanced meshes for windows, and animate selections with useFrame. Good starting point if you want to visualize developer activity spatially or learn R3F patterns for data-driven 3D scenes. The compare mode for side-by-side profiles is a nice touch.
Install to Claude Code
npx -y skills add aradotso/trending-skills --skill git-city-3d-github-visualization --agent claude-codeInstalls into .claude/skills of the current project.
Keeps your Mac awake while Claude Code, Codex or Cursor works. Lets it sleep when they are done.
Try free for 7 days →
Connect your Claude agent to live crypto prices and trading routes via 1inch
Get the MCP →
Block distracting apps from your iPhone permanently without a 3rd party app. Free and open source.
Block now (100% free) →
belt cli automatically finds the best tools and skills for your agent. image, video, music, tts...
one prompt install →
Free an open-source skills that make AI coding agents easier to understand, verify, and control.
Download for free →Files
SKILL.md
Select a file.
Featured
Keeps your Mac awake while Claude Code, Codex or Cursor works. Lets it sleep when they are done.
Try free for 7 days →Connect your Claude agent to live crypto prices and trading routes via 1inch
Get the MCP →Block distracting apps from your iPhone permanently without a 3rd party app. Free and open source.
Block now (100% free) →belt cli automatically finds the best tools and skills for your agent. image, video, music, tts...
one prompt install →Free an open-source skills that make AI coding agents easier to understand, verify, and control.
Download for free →
