Resources
Skills
Reusable Claude Code skills, distilled from building this site — each one captures a technique so it need not be rederived.
A skill is a folder holding a single SKILL.md — a short brief that teaches Claude Code how to do one thing well, plus any scripts it should reuse. Drop the folder in and it is found automatically; there is nothing to register.
# drop the folder in — Claude Code reads its description and loads it when it fits ~/.claude/skills/<skill-name>/SKILL.md # personal — available in every project <project>/.claude/skills/<skill-name>/SKILL.md # or scoped to one repository
To use one, you never name it — you just describe the task (“build a glowing particle hero”, “turn this essay into a reading page”), and Claude Code matches the request to the skill’s description and pulls it in. What follows is the set that came out of making this site, written to be general enough for anyone’s work, not just mine.
volumetric-pointcloud-figure
Volumetric Point Clouds
Luminous WebGL point-cloud figures, built to feel alive.
A point cloud reads as volume made of light: thousands of small, soft, glowing points whose density and colour suggest a form. The skill carries the whole recipe — a glow shader, a sparkle-and-saturate pass, viewport-gated animation, reduced-motion — so all you write is the geometry.
Live: a barred-spiral galaxy — a ~30-line generator written against the skill’s bundled scaffold. The shader, twinkle, hover-spin, and performance gating come for free. Hover to turn it.
~/.claude/skills/volumetric-pointcloud-figure/ ├─ SKILL.md └─ scripts/pointcloud-scaffold.js # copy in, replace one generator function
text-to-topology
Text to Topology
Turn a body of writing into a navigable map of its ideas.
A topology turns prose into a place — entities become placed nodes, relations become links, and a sequence becomes a path through the space. The craft is in the data model: a flat, hand-editable node table, a deliberate placement strategy (real coordinates, force-directed, or authored), and one canonical source so no two copies drift.
A voyage (gold) threaded through landfalls, with a single drop below the surface — the same shape whether it renders as SVG, canvas, or a point cloud.
// one row per node — flat, hand-editable, the single source of truth // [id, x-signal, y-signal, category, kind] [ 'troy', 26.24, 39.96, 7, 'port' ], [ 'circe', 13.09, 41.24, 2, 'isle' ], [ 'ithaca', 20.72, 38.36, 3, 'home' ]
project-page-system
Project Page System
One design language, held across every page of a project.
When a project grows past one page, the enemy is drift. The fix is a single shared stylesheet that owns every visual atom — a tiny palette, one type scale of named roles, one control height — which every page links, under one rule: pages may lay things out, but never restyle an atom.
- displayTitle in the display role
- bodyBody copy in the reading role
- smallLabels & meta
The whole system in a glance: a rationed palette and a handful of named type roles — the tokens this very page is built from.
:root {
--paper: #090d09; --ink: rgba(255,255,255,0.64);
--mark: rgb(143,119,54); /* the one rationed accent */
--display: 1.5rem; --text: 1.0625rem; --small: 0.8rem;
--control-h: 36px; /* every control shares one height */
}
prose-to-reading-page
Prose to Reading Page
Set long-form writing to be read on screen.
The goal is sustained reading — a page you can fall into, where the typography does the work and the effects stay out of the way. A capped measure, one generous reading serif, considered pull quotes, and a scroll-reveal that is subtle, fires early, and fails open when scripts are off.
Writing
Origin stories operate like early compression algorithms — distilling the complexity of reality into symbolic forms small enough to recall and retell.
“Design is not just problem-solving; it is world-building.”
A whittled page set the way the skill would set it — measure, reading serif, and a pull quote lifted from the flow.
.reading { max-width: 39rem; } /* ~68 characters */
.prose { font: 400 1.0625rem/1.72 serif; }
/* reveal: small move, once only, fails open, honours reduced-motion */