Show your AI coding DNA on your GitHub profile.
GitHub 프로필 README에 AI 도구 사용 통계를 자동으로 보여주는 카드입니다. Claude Code, Codex CLI 등의 로컬 사용 데이터를 분석하여 SVG 카드를 생성하고, GitHub Gist를 통해 프로필에 표시합니다.
- 3줄 설정 — clone → init → README에 붙여넣기
- 자동 업데이트 — Claude Code 종료 시 Stop hook이 Gist를 자동 업데이트
- API 키 불필요 —
~/.claude/로컬 파일에서 직접 파싱 - Top 3 Models — 가장 많이 쓴 모델 3개를 자동 분석
- 10 Themes — dark, radical, tokyonight, dracula, neon, matrix 등
- Animated SVG — 게이지바, 랭크 링, 글로우 이펙트
- Badges — 개별 도구 배지 커스터마이즈
git clone https://github.com/kwakseongjae/github-readme-ai-stats.git
cd github-readme-ai-stats
npm run initnpm run init 실행 시 자동으로:
⚡ github-readme-ai-stats init
[1/5] Checking gh CLI...
✓ Logged in as @yourname
[2/5] Scanning local AI tool data...
✓ Claude Code: 392 sessions, 10.0M tokens
[3/5] Generating stats card...
✓ Cards generated (dark + default)
[4/5] Creating GitHub Gist...
✓ Gist created: https://gist.github.com/xxxxx
[5/5] Registering Claude Code auto-update hook...
✓ Stop hook registered
→ Stats will auto-update when you exit Claude Code
─────────────────────────────────────────
✅ Setup complete! Add this to your GitHub profile README:
출력된 마크다운 코드를 github.com/USERNAME/USERNAME 레포의 README.md에 붙여넣기:
이후로는 Claude Code를 사용하고 종료할 때마다 Stop hook이 자동으로 실행되어 Gist가 업데이트됩니다. 프로필 README에서 항상 최신 통계가 표시됩니다.
수동으로 업데이트하고 싶다면:
cd github-readme-ai-stats
npm run sync기본 테마는 dark입니다. 다른 테마로 변경하려면 scripts/init.js에서 테마를 수정하고 다시 npm run init을 실행하세요.
프리뷰로 모든 테마를 미리 볼 수 있습니다:
npm run preview # 브라우저에서 모든 테마 확인| Theme | Preview |
|---|---|
default |
 |
dark |
|
radical |
|
tokyonight |
|
dracula |
 |
neon |
 |
synthwave |
 |
gruvbox |
 |
nord |
 |
matrix |
 |
코드를 복사하고 usage= 뒤의 텍스트만 원하는 대로 수정하면 됩니다:
배지는 Gist에 SVG를 직접 업로드하거나, 프로필 README에 아래 코드를 붙여넣으세요:
<!-- 예시: 텍스트를 원하는 대로 변경 -->
사용 가능한 도구: claude-code, codex, claude, chatgpt, github-copilot, cursor, gemini, windsurf
git clone & npm run init (최초 1회)
│
├─ ~/.claude/stats-cache.json 파싱
│ → 모델별 토큰 사용량, 세션 수, 일별 활동
│
├─ ~/.claude/usage-data/session-meta/*.json 파싱
│ → git 커밋 수, 코드 라인, 파일 수정
│
├─ SVG 카드 생성 (dark + default)
│ → GitHub Gist에 업로드 (gh CLI)
│
└─ Claude Code Stop hook 자동 등록
│
└─ 이후 Claude Code 세션 종료마다
→ 자동 데이터 재파싱 → Gist 업데이트
| 소스 | 경로 | 수집 항목 |
|---|---|---|
| stats-cache | ~/.claude/stats-cache.json |
모델별 토큰, 세션 수, 일별 활동 |
| session-meta | ~/.claude/usage-data/session-meta/*.json |
git 커밋, 코드 라인, 파일 수정 |
| JSONL logs | ~/.claude/projects/**/*.jsonl |
상세 세션 로그 (fallback) |
| Codex CLI | ~/.codex/sessions/**/*.jsonl |
모델별 토큰, 요청 수 |
ccusage (11.8K stars), cc-proficiency 등 검증된 오픈소스가 동일한 로컬 파일을 데이터 소스로 사용합니다.
조직 계정: Admin API 자동 연동
조직(Organization) 계정이 있다면 Admin API Key로 실시간 연동도 가능합니다.
| Provider | Admin Keys | 필요 권한 |
|---|---|---|
| Anthropic | platform.claude.com/settings/admin-keys | 조직 admin |
| OpenAI | platform.openai.com/settings/organization/admin-keys | 조직 Owner |
개인 계정에서는 Admin Keys가 제공되지 않습니다.
| 명령어 | 설명 |
|---|---|
npm run init |
최초 설정 (데이터 파싱 → Gist 생성 → hook 등록) |
npm run sync |
수동 Gist 동기화 |
npm run preview |
브라우저에서 모든 테마 프리뷰 |
npm run dev |
로컬 API 서버 (http://localhost:3000) |
| Layer | Technology |
|---|---|
| CLI | Node.js (init, sync, preview) |
| SVG | Pure SVG templates + SMIL animations |
| Data | Local file parsing (~/.claude/, ~/.codex/) |
| Sync | GitHub Gist via gh CLI |
| Auto-update | Claude Code Stop hook |
| Icons | Simple Icons + custom PNG (Claude Code, Codex) |
Contributions welcome!
- GitHub Action으로 주기적 Gist 동기화
- 더 많은 AI 도구 지원 (Gemini, Cursor, Windsurf)
- 새로운 테마
- 활동 히트맵, 언어 분석 등 카드 변형
MIT