Answer Me With Html

Answer me with HTML — an agent skill that answers hard questions with a one-page HTML you can actually read. 让 AI Agent 用一页 HTML 回答复杂问题。

LLM Mart
0 views 6.4k listing impressions

Once installed, ask questions the way you always do:

> Explain the TCP three-way handshake
> Map out how the modules in this repo fit together
> Redis or Memcached for our cache?

The agent writes a short Markdown draft and hands it to the CLI that ships with the skill. About 50 ms later you have a page:

https://github.com/user-attachments/assets/d3063a28-5dfd-4c44-a562-be901c49b249

24-second demo. Turn the sound on for the music.

Why not just ask for HTML?

You can. Models write decent HTML now. The problem is the bill you pay in output tokens: the model has to type every line of CSS, every wrapper div and every SVG coordinate. Output tokens are also what you sit and wait for.

With this skill, the model writes only the content. We asked the same questions with the same model both ways (3 topics × 3 runs, medians, Claude Sonnet 5.5):

Ask for HTML directly Answer me with HTML
Output tokens 6,873 923 7.4× fewer
Time 46 s 13 s 3.6× faster
Cost per answer $0.22 $0.26 about the same

The same TCP question answered both ways

One run from the benchmark: same prompt, same model, and both pages are usable. This run took 9,351 output tokens for the plain page and 899 with the skill. The table above shows the medians.

Why the cost doesn't drop too: the skill adds two short turns (load the skill, run the CLI), and every turn re-reads the conversation context. You save the waiting, not the bill. Per-topic numbers and the script to reproduce them are in bench/.

Install

You need Node.js 20 or newer. There is no npm install step. The CLI is bundled inside the skill.

Let your agent install it (recommended)

Paste this into Claude Code, Codex, Cursor, OpenCode or any other agent:

Install the Answer me with HTML skill: run npx -y skills add QingYunA/answer-me-with-html -g -y, and pass -a with your own agent name (for Claude Code, -a claude-code). Then read its SKILL.md and use it to make a page that explains the TCP three-way handshake, so we know it works.

Claude Code plugin

Run this inside Claude Code:

/plugin marketplace add QingYunA/answer-me-with-html
/plugin install answer-me-with-html@answer-me-with-html

One command

npx skills add QingYunA/answer-me-with-html

It asks which agents to install into. The installer, vercel-labs/skills, supports more than 70 agents.

Manual install

Copy the skills/answer-me-with-html folder into your agent's skill folder. For Claude Code:

git clone --depth 1 https://github.com/QingYunA/answer-me-with-html.git /tmp/answer-me-with-html
cp -R /tmp/answer-me-with-html/skills/answer-me-with-html ~/.claude/skills/answer-me-with-html

Skill folders for other agents: Codex ~/.codex/skills/, Cursor ~/.cursor/skills/, OpenCode ~/.config/opencode/skill/.

No setup is needed after install.

What you ask, what you get

You ask You get
"Explain the TCP three-way handshake" A sequence diagram, a state diagram and a flag table
"How are the modules in this repo organized?" A folder tree plus a call graph
"Redis or Memcached?" A comparison table with ✓ and ✗, then a verdict
"What's wrong with this paragraph?" Each sentence annotated, with the problem words and fixes
"How did Kubernetes come about?" A timeline with the key moments highlighted
"How do I show hidden files with ls?" No page. A one-line question gets a one-line answer

The agent decides when a page is worth it: related concepts, multi-step flows, multi-way comparisons. You can also just say "explain it in HTML".

From the project's README.

Comments (0)

Sign in to join the conversation.

No comments yet.

Related tools