Real Agent Cases

Build a terminal-to-HTML sharing tool with Claude Code for web

Posted
by Simon Willison
Last checked
Method:
How we verify

Evidence: Shown on videoThe source includes a video or screen recording of the agent doing the task.

Outcome

Claude Code for web built a terminal-to-html tool that turns pasted terminal output into a shareable gist-preview link, recorded start to finish in an 11-minute video.

Agent

Claude Code for web

Prompt Original prompt

Exact prompt as published in the source.

Build a new tool called terminal-to-html which lets the user copy RTF directly from their terminal and paste it into a paste area, it then produces the HTML version of that in a textarea with a copy button, below is a button that says "Save this to a Gist", and below that is a full preview. It will be very similar to the existing rtf-to-html.html tool but it doesn't show the raw RTF and it has that Save this to a Gist button

That button should do the same trick that openai-audio-output.html does, with the same use of localStorage and the same flow to get users signed in with a token if they are not already

So click the button, it asks the user to sign in if necessary, then it saves that HTML to a Gist in a file called index.html, gets back the Gist ID and shows the user the URL https://gistpreview.github.io/?6d778a8f9c4c2c005a189ff308c3bc47 - but with their gist ID in it

They can see the URL, they can click it (do not use target="_blank") and there is also a "Copy URL" button to copy it to their clipboard

Make the UI mobile friendly but also have it be courier green-text-on-black themed to reflect what it does

If the user pastes and the pasted data is available as HTML but not as RTF skip the RTF step and process the HTML directly

If the user pastes and it's only available as plain text then generate HTML that is just an open <pre> tag and their text and a closing </pre> tag

Try this in:

ChatGPT Gemini Grok

Sends the Original prompt shown above. ChatGPT and Grok open with it filled in, and ChatGPT may send it straight away. Gemini opens empty, so we copy the prompt for you to paste. Every button also copies it.

The source used Claude Code for web, which can take actions on your computer or in a browser. These are general chat tools, so results may differ, and a normal chat may only give you a plan.

Opens in a new tab. We don't see what you send.

These links are only a shortcut. We're not affiliated with OpenAI, Google or xAI, and your results may not match the source.

Optional stronger version

Our rewrite with extra checks. The poster didn't test it.

Goal: Build terminal-to-html: paste RTF from a terminal, get HTML in a textarea with copy, 'Save this to a Gist', and a live preview.

Inputs (fill in or confirm):
- The existing similar tool to copy structure from
- Where the tool should live in the repo
- GitHub auth approach for Gists (token entered by the user, never stored server-side)
- The exact behaviour spec (paste area, output textarea, copy button, Gist button)
- Where I want the tool's code and a test page

Rules:
- Handle the clipboard's text/rtf and text/html types: if the paste has HTML but no RTF, skip the RTF step and process the HTML directly; if it's only plain text, output an opening <pre> tag, the text and a closing </pre> tag.
- Preserve colours and bold/italic; strip scripts and event handlers from the output.
- Match the existing tool's layout and styles.
- Keep it a single static HTML file with no build step.
- Restate the spec as a short checklist and build only what it lists.
- Convert pasted rich text to clean HTML: keep colours and bold, drop editor-specific junk.
- Handle sign-in exactly like openai-audio-output.html: the same use of localStorage and the same flow to get a token if the user isn't signed in; never put the token in the page source or the repo.
- Show clear error messages if Gist creation fails (bad token, rate limit, network).
- Test with at least three samples: plain text, coloured output and very long output.
- Commit with a clear message; open a pull request rather than pushing to main.

Checkpoint: Don't create a real Gist during testing unless I say so; ask before committing.

If you get stuck: If a login, CAPTCHA or two-step code appears, stop and ask me to handle it; never guess or store passwords.

Verify before you finish: Test with a pasted coloured terminal sample and confirm preview matches the textarea HTML.

Output: The HTML file, a short test note and screenshots of the preview.

Done when: pasting a coloured terminal snippet produces matching, safe HTML I can copy.

Source

https://simonwillison.net/2025/Oct/23/claude-code-for-web-video/

Related cases

  • Vibe-code a 3D town-building game with Claude CodeEvidence: Article or interview

    From a single informal prompt, Claude Code built a working 3D game for placing buildings and driving around in about four minutes; follow-up prompts added a fire truck, traffic, and fires.

    Reported by One Useful Thing:Working game in about four minutes

    Claude Code · Coding · Source date:

  • Build a blog feature by voice with Codex while cookingRecreated promptEvidence: Screenshots or logs

    Talking to Codex in voice mode while cooking dinner, the author got a Django newsletters archive with four importers and a pull request, then finished the rest with typed prompts.

    OpenAI Codex (ChatGPT desktop, voice mode) · Coding · Source date:

  • Write and ship a complete Datasette plugin with Claude CodeEvidence: Screenshots or logs

    Claude Code (Sonnet 4.5) wrote every line of code and every test for the datasette-os-info plugin with minimal prompting, and the author shipped it.

    Claude Code · Coding · Source date: