html-anything skill
The agent turns rich answers, files, folders and service exports into an HTML page in a ready style, checked in a browser
- 161 ★ on the repository
- Last commit
- MIT-0
Extended access
Why this level
- Reads the files, folders and links you point at and opens the built page in a browser
- Exports with personal data go into the HTML whole, and the page is easy to forward along with them
Install
- Works in
In your terminal, with SkillFoxx CLI
npx skillfoxx add skills/html-anythingDetects the agents on your machine, shows the access level and pins the version.
Other ways to install
Access and checks
How we reviewExtended accessThe tool runs code or makes network calls and only reads external data.
- Reads the files, folders and links you point at and opens the built page in a browser
- Exports with personal data go into the HTML whole, and the page is easy to forward along with them
This is third-party code. Review the repository files before installing.
What it does
The html-anything skill decides when an answer deserves a page and builds a self-contained `output.html`, plus an `assets/` folder when images are involved. Short replies stay text. The input can be a topic, CSV, JSON, PDF, DOCX, a log, a messenger chat, a notes folder, a link or an export such as Amazon orders, Kindle highlights or Spotify history. 60 source types have their own instructions in `prompts/sources/`. The agent picks the style itself from 17 systems: teaching studio, dashboard, document, timeline, places map, terminal report and others. It opens the page in a browser and checks it before handing it back. If you name a source but have no file yet, the skill first explains how to export the data. The skill runs in Claude Code, Codex, Cursor, Cline, Windsurf and other Agent Skills agents; for claude.ai there is an archive with `SKILL.md` and the `prompts/` folder.
Who it is for. People who ask an agent to make sense of a report, a log or a personal export and want a page they can open and forward.
Good fit when
- A long PDF or DOCX has to become a readable breakdown
- A bank, QuickBooks or Amazon export sits in a CSV and you want a dashboard from it
- A CI log or a stack trace should become a report the whole team can read
- An export from WeChat, Slack or Discord should turn into a page with the conversation's highlights
- Explaining a topic to a learner works better as an interactive studio than as a long answer
Not a fit when
- The answer is short and conversational: the skill leaves such replies as text by design
- The data holds medical or financial records and you want a verdict: pages are for organisation and review, not advice
- You need your own brand design system with exact tokens: the skill picks a style from its 17 ready ones
Example request
Here is my Amazon order export for three years as a CSV. Break it down and build a page that shows spending by month and categoryLimitations
- A page can hold the original personal data right inside the HTML, so treat it like the source export.
- claude.ai needs a Pro, Max, Team or Enterprise plan with code execution on, and skills there do not sync with Claude Code or the API.
- ChatGPT and Gemini in the browser are not supported; the author points to Codex CLI and Gemini CLI instead.
- The last commit in the repository dates from May 2026.
How to disable. Delete the html-anything folder from the agent's skills directory, for example `~/.claude/skills/html-anything`. On claude.ai remove the skill from the Skills page in settings. Pages already generated stay as ordinary HTML files.
FAQ
How do I install html-anything in Claude Code?
The common route for most agents is `npx skills add clockless-org/html-anything`. For Claude Code the author also describes cloning the repository into `~/.claude/skills/html-anything` and restarting, and for Codex into `$HOME/.codex/skills/html-anything`.
Do I need to mention HTML in the request?
No. The skill decides on its own that an answer deserves a page, so you can just ask, for example, what your order history says about you. Short questions stay plain text.
What if I do not have the export file yet?
Name the source, for example Spotify history or Google Photos Takeout. The skill first shows the export steps and builds the page once you have the file.
What input does html-anything accept?
A topic, CSV, JSON, Markdown, PDF, DOCX, a log, a chat export, a folder, a link or a service export. 60 source types have their own prompts and the style is picked from 17.
Can I open the finished page offline?
Pages are local and static: open them directly in a browser or put them on any static host. When images are needed, an `assets/` folder sits next to `output.html`, and asking for single-file packs everything into one file.
Discussion
No questions or reviews yet.
Related
SkillsA skill that typesets resumes, one-pagers, letters, reports and slides from templates into PDF, PNG and PPTX and checks the result before delivery
A plugin with a CLI and skills for Claude Code and Codex: agent-made HTML goes to a private AWS archive readable from a phone.
Learn from materials
learn-from-materials
A skill that turns books, PDFs, slides and documents into a traceable knowledge base and an interactive learning page with sources, maps and self-check
A CLI and skill for an agent to publish reports and specs as HTML documents that a team comments on, with every version kept
A skill that draws 45 types of animated diagrams from a short JSON spec and saves them as HTML, SVG, PNG, GIF and MP4
A document pipeline skill: anything to markdown, markdown to clean html and publisher-grade docx, and html back to markdown
Comparison with similar tools
Cards that share the main search query, and how they differ.
| Tool | Official | Repository stars | Main difference |
|---|---|---|---|
| html-anything (this card) | no | 161 | |
| Answer Me With HTML | no | 5,711 | answers with an HTML page and diagrams, has voice-over, but no source-type routing for exports |
| Effective HTML | no | 4,032 | six skills for wireframes, prototypes and plans instead of one router across source types |
README in short
The README opens with a before and after comparison of a plain answer and a page, then a gallery of eleven demos across four use cases. After that come the install routes, the automatic style routing rules, a table of use cases with example sources and a developer note on the bundled CLI.
README badge
Original SKILL.md
---
name: html-anything
description: Turn rich agent answers and any file, folder, URL, or export into a polished single-file HTML page. Auto-picks a default route plus 17 concrete design systems (teaching, dashboard, atlas, timeline-story, document, …).
version: 0.1.0
homepage: https://github.com/clockless-org/html-anything
when_to_use: User says "make a webpage", "create a teaching site", "make an interactive studio", "explore this object/system", "turn this into HTML", "visualize/analyze this", "make a dashboard/report/atlas", "make it beautiful/readable/shareable", gives a file/folder/URL to make browsable, names a data source they want exported and converted, or asks for a rich deliverable that would otherwise become a long Markdown answer.
metadata:
openclaw:
emoji: "🧩"
homepage: https://github.com/clockless-org/html-anything
---
# html-anything
You are the `html-anything` skill.
Your job is to turn **an idea, file, folder, URL, exported dataset, or rich
deliverable request** into a polished live HTML page the user can open, share,
or publish.
Do not present this as a parser, CLI, or internal pipeline. The user only
needs to understand:
- **Input**: an idea, file, folder, URL, or source they want help exporting.
- **Output**: a live HTML page, usually `output.html`, sometimes with an
`assets/` folder when generated images or local media are useful.
Everything else is your responsibility: source understanding, export
guidance, style choice, page design, asset generation, implementation,
browser verification, and final handoff.
Two constraints are non-negotiable:
1. **Style fidelity**: if a style is based on a reference design, reproduce
the reference's layout system, first viewport, component vocabulary,
typography roles, color/surface language, and motion grammar. Do not merely
borrow the mood.
2. **Final HTML compliance**: the delivered HTML must visibly and structurally
follow the selected style, not a generic html-anything report with different
colors.
## User-Facing Promise
Accept requests like:
- "Create an interactive teaching site about the solar system."
- "Turn my Amazon order history into a personal spending atlas."
- "Make this WhatsApp export into a relationship rhythm report."
- "Turn this transcript into a meeting scorecard."
- "Make this CSV into a dashboard I can share."