plz

English | 한국어 | 日本語 | 简体中文

AI coding agent skills for Claude Code and Codex, by codekongdev. The first skill, plz-3d-explain, turns any technical concept into an interactive 3D study page.

Each plz-<task> name reads like a request to your agent: “please do this.”

Live demo · Install · Usage · Skills

https://github.com/user-attachments/assets/eb09c80d-4260-46b4-ae61-092b9f979167

A one-line request like this is enough to start, and the demo above covers one topic of this kind:

Explain how an AI agent code sandbox works in 3D.

Install

To install with npx skills, you need Node.js 22.20 or later (with npm and npx), Git, and a working Claude Code or Codex installation. Check the tools in your terminal:

node --version
npm --version
git --version

Choose your agent below. These commands install plz-3d-explain globally, so it is available across projects.

Claude Code:

npx skills add codekongdev/plz --skill plz-3d-explain -a claude-code -g

Codex:

npx skills add codekongdev/plz --skill plz-3d-explain -a codex -g

For a project-only installation, run the matching command from that project's directory and omit -g. Claude Code uses .claude/skills/; Codex uses .agents/skills/. Follow any confirmation prompts from the installer.

Confirm the installation for your agent:

npx skills list -g -a claude-code
npx skills list -g -a codex

Look for plz-3d-explain in the matching list. For a project-only installation, run the list command from the same project and omit -g too.

List available skills:

npx skills add codekongdev/plz -l

Install all skills globally, choosing the agent when prompted:

npx skills add codekongdev/plz --skill '*' -g

For a manual Claude Code installation, clone the repository, then copy or symlink skills/plz-3d-explain to ~/.claude/skills/plz-3d-explain. To copy it:

git clone https://github.com/codekongdev/plz.git
mkdir -p ~/.claude/skills
cp -R plz/skills/plz-3d-explain ~/.claude/skills/plz-3d-explain

See plz-3d-explain on skills.sh.

Usage

Start a new agent session in the project where you want to create the page. To use the skill explicitly:

• Claude Code: /plz-3d-explain Explain how container isolation works in 3D.
• Codex: $plz-3d-explain Explain how container isolation works in 3D.

You can also ask in plain language:

• “Explain how container isolation works in 3D.”
• “Show how a TCP handshake works as a 3D model.”

You can also ask in Korean, Japanese, or Simplified Chinese; the page is written in the language you ask in.

If the skill is not available, check the agent and installation scope with the list commands above, then start a new session. Project-only skills must be used from the project where you installed them. If npx is missing or reports an unsupported Node.js version, check the prerequisites above.

How it works

When you ask for a page, plz-3d-explain works in four steps:

1. Check the material. It checks the topic or repository, records sources and verification dates, and marks anything unverified.
2. Plan the chapters. It plans the chapters, each with an action that plays out cause and effect on the model.
3. Fill the template. It fills the template with text and scenes. The result is one HTML file with no build step.
4. Validate in a browser. It checks the finished page for console errors, overlapping or clipped labels, horizontal overflow, autorun, and touch gestures.

Scope and requirements

• Good for: learning a technical concept, mechanism, or system structure with a 3D model.
• Out of scope: static architecture or sequence diagrams, data charts, Blender modeling, product landing pages, and app UI design.
• Opening a page: needs an internet connection, because three.js r170 and web fonts load from CDNs.
• Creating a page: requires a local HTTP server (the skill uses Python 3 as an example) and a browser automation tool the agent can use, such as Playwright.

Installing the skill does not install Python or browser automation. If these tools are unavailable, ask your agent to help prepare them before validation. A generated HTML file alone does not mean browser validation passed; check the agent’s report for what it actually tested.

Details are in the skill README.

여기까지가 README 앞부분입니다. 나머지는 원문에서 읽을 수 있습니다. README 전문 보기 ↗