sepivip

Claude Code Visualizer — Development skill for Claude Code

Development community

Interactive, terminal-styled trainer to master the Claude Code CLI — playground, cheatsheet, keyboard visualizer & quizzes.

How to install Claude Code Visualizer

This entry records only its repository, not the path inside it, so there is no exact command to give. Open sepivip/claude-code-visualizer and copy the folder into ~/.claude/skills/, or the file into ~/.claude/agents/.

What Claude Code Visualizer does

Interactive, terminal-styled trainer to master the Claude Code CLI — playground, cheatsheet, keyboard visualizer & quizzes.

Alternatives in Development

Understand Anything — Graphs that teach graphs that impress 80.7k ★
OpenAI Codex CLI — (Rust implementation) 67.8k ★
Shortcuts Playground Plugin — Shortcuts Playground: A Claude Code and Codex plugin for building, validating, signing, and remixing macOS/iOS 1.1k ★

README

cckeys — Claude Code Interactive Trainer

An interactive, terminal-styled web app to help you **master the Claude Code CLI** — like the shortcut-visualizer pages for Photoshop/Illustrator, but playful and hands-on.

**🔗 Live at [cckeys.work](https://cckeys.work)**

The whole app presents as **one Claude Code window**. You learn by doing — no install, nothing to configure, runs entirely in your browser.

Features

⌨️ Keyboard visualizer — a full keyboard where shortcut keys glow; click a key to light up its partner keys and see every shortcut on it (macOS / Windows / Linux views).
🔍 Cheatsheet — searchable, filterable catalog of every Claude Code feature, with examples.
🎮 Playground — a safe simulated Claude Code terminal (nothing executes) to try commands.
🧠 Quiz — multiple-choice and type-the-shortcut questions, scored, with explanations.
🚀 Start here — a guided, chaptered track for newcomers (prompt → modes → commands → memory → power features).

Built on a curated catalog of **Claude Code features across 12 domains**, audited against the official docs.