# Visual Teach

> `visual-teach` is the styling + behavior floor under `/teach` lessons and the audit-skill HTML reports — link its Base first, then use ready-made `vt-*` blocks for the standard parts. Use the blocks for the commodity parts and build your bespoke exercise or report content on top, never instead of it.

- Skill: `caneff/visual-teach` (Agent Skill, multi-file: 68 files)
- Install (CLI): `npx skillmds@latest add caneff/visual-teach`
- Raw SKILL.md: https://api.skillmd.com/api/skills/caneff/visual-teach/raw
- Safety review: pending
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: Web & Frontend
- Author: caneff (https://skillmd.com/u/caneff)
- Updated: 2026-09-22
- Page: https://skillmd.com/skills/caneff/visual-teach

---


# visual-teach

**Seeding — first action:** copy all assets into the workspace in one shot:

```sh
cp -R "<this skill's assets dir>"/* ./assets/
```

Use the skill base directory announced when this skill loads; do **not** hardcode a developer checkout path. Then open **`assets/visual-teach.md`** — the catalog lists every block with a "reach for when…" trigger, the page shell for new lessons, and linking instructions.

**Floor, not a ceiling:** `vt-*` covers commodity parts. When the lesson's win is to _produce or manipulate_ something live (write a regex, flex a layout), build a bespoke exercise in `./assets/` alongside the `vt-*` blocks — don't settle for a quiz that only tests recognition.