skills/literate-guide/SKILL.md
Create a narrative guide to a codebase or feature in the style of Knuth's Literate Programming — code and prose interwoven as a single essay, ordered for human understanding rather than compiler needs. Use when the user asks to 'explain this codebase as a story', 'write a literate guide', 'create a narrative walkthrough', 'tell the story of this code', 'Knuth-style documentation', 'weave a guide for this feature', or when they want deep, readable documentation that treats the program as literature. Also trigger when someone wants a document that a thoughtful reader could follow from start to finish and come away understanding both WHAT the code does and WHY every design choice was made.
npx skillsauth add petekp/claude-skills literate-guideInstall this skill globally with one command. Works with Claude Code, Cursor, and Windsurf.
3 of 9 scanners reported clean
Some scanners were skipped, did not run, or reported a non-clean status. Review each row below.
Create a guide that tells the story of a codebase or feature the way Knuth intended programs to be read: as literature. The output is a single narrative essay where code excerpts and prose are interwoven, ordered by the logic of human understanding rather than file layout or execution order.
Knuth's core observation was simple: programs are read far more often than they are written, yet we organize them for the compiler's convenience, not the reader's. A literate program reverses this — the author decides the order of presentation based on what a human needs to understand first, and the code appears within that narrative exactly where it becomes relevant.
For an existing codebase, this means:
main() lives.§1, §2, §3... (that's the § character, U+00A7 — not the letter "S"). Sections cross-reference each other using this same notation.Ask the user what they want the guide to cover:
question: "What should this literate guide cover?"
header: "Scope"
options:
- label: "Entire codebase"
description: "The full story of this project, end to end"
- label: "A specific feature or subsystem"
description: "Deep narrative on one part of the codebase"
- label: "A recent change or PR"
description: "The story of a specific set of changes and why they were made"
If they choose a feature or subsystem, clarify which one. If the codebase is large (50+ files), strongly recommend scoping to a subsystem — a good literate guide goes deep, and breadth dilutes that.
Also ask about audience:
question: "Who will read this?"
header: "Audience"
options:
- label: "A developer joining the team"
description: "Assumes general programming knowledge, no project-specific context"
- label: "A senior engineer reviewing the architecture"
description: "Assumes deep technical knowledge, wants to understand design rationale"
- label: "Future me"
description: "Personal documentation for a system I'll forget the details of"
- label: "Open source contributors"
description: "External developers who want to understand the project well enough to contribute"
Read the codebase thoroughly. This isn't a skim — you're looking for the story. Investigate in this order:
git log for major refactors, pivots, or rewrites. These are plot points in the story.Before writing, identify:
§ symbol: §1, §2, etc. (not "S1" or "Section 1" — the section sign § is a deliberate stylistic choice from Knuth's TeX tradition). Each section should have a name that describes the idea, not the file. "§4. Why events, not callbacks" is better than "§4. The EventEmitter class."Follow the template in references/guide-template.md. Key principles:
Voice and tone:
Code excerpts:
retries is passed as a parameter, not read from config. This makes testing deterministic (§12)."§N) when code in one section relates to concepts explained in another.Section structure:
Cross-references:
§ symbol for all cross-references: "as we saw in §3", "this connects to the retry logic in §12", "the transport layer (§8) hides this complexity". The § symbol is load-bearing — it's the visual cue that tells the reader "this refers to another section in this document."Diagrams:
Before delivering, read the guide as if you've never seen the codebase:
§N reference should point to the right section. A broken cross-reference in a literate guide is like a broken hyperlink — it undermines the web of understanding.Write the guide as a single Markdown file. Suggested locations:
.claude/docs/literate-guide.md for the full codebase.claude/docs/literate-guide-{feature}.md for a feature-specific guideTell the user what you've written and where it is. Mention the section count and the major themes covered so they know what to expect.
development
Draft short, plainspoken notes in the author's voice that help reviewers understand non-obvious choices, boundaries, and preserved behavior in the author's own pull request or local diff. Use when the user asks to self-review, annotate, or add reviewer context to their PR or changes. Draft locally when no PR exists, and post approved notes as one GitHub review when a PR does exist. Do not use for reviewing someone else's PR, writing code comments, explaining code generally, or drafting a PR description. Never post without explicit approval.
tools
Design and build pure-CSS (zero-JavaScript) Tailwind CSS v4 plugins of unusual depth and craft. Use when the user wants to create, architect, or refine a Tailwind utility plugin or CSS effect — e.g. "make a tailwind plugin", "build a tw-* plugin", "a CSS-only shimmer/fade/glow/grain/noise utility", "tailwind v4 @utility", "package this effect as a plugin", or wants an effect with surprising visual depth (gradients, masks, filters, SVG filter tricks, scroll-driven animation). Pairs deep CSS/SVG technique research with a bespoke tuning workbench for dialing the effect in. Inspired by tw-fade and tw-shimmer.
content-media
Create clear, polished before-and-after screenshots for a GitHub pull request. Use when a UI change needs visual proof: capture matching states, crop to the relevant UI, stitch and caption one comparison image, attach it natively to the PR, and keep the image out of the repository.
testing
--- name: latent-potential description: First-principles, team-of-experts assessment of a software project that surfaces latent potential; underexploited assets, a sharper north star, missing high-leverage capabilities, better framing and messaging. Produces a prioritized, evidence-grounded report with cheap probes, a reframe candidate, a stop-doing list, and an honest skeptic's case. Use whenever the user wants fresh eyes on a project they have built: "what am I sitting on", "what could this be