HTML Comparison Matrix

When picking between candidates on multiple criteria, a comparison matrix beats a paragraph. A weighted matrix beats an unweighted one — weights surface the implicit priorities and let the user argue with their own past judgments.

Phase boundary. This skill handles the evaluative phase of comparison — scoring candidates that already exist. If the user hasn't named candidates yet and is still asking "what are the options" or "show me approaches", hand off to html-brainstorm-grid instead. The boundary signal is whether candidates appear in the prompt: if so, score them here; if not, generate them there. The two skills are designed to compose — generate options there, then evaluate them here.

Pre-flight — run BEFORE writing the artifact

Invoke html-skills:html-skills-listen (Skill tool) first; it is idempotent. If it returns a URL, inject it verbatim as window.__CLAUDE_SUBMIT_URL__ in the HTML you are about to write, ?t= query string included (a local, single-session loopback handshake — not a credential). If it reported web/sandbox mode, leave that line out; submitToClaude then falls back to clipboard mode.

When to use this skill