Video wird geladen...
Video konnte nicht geladen werden
My favorite way of interacting with Claude Code is to have it generate static HTML files as outputs (reports, explorations, code structure, mockups etc.) I wanted to iterate on the file by commenting in browser and having Claude update the output live. So, I built this Claude Skill👇 How... show more
216,101 Aufrufe • vor 3 Monaten •via X (Twitter)
45 Kommentare

Give it a try:

And ask CC to host it here

gist pages seems better

That’s pretty cool too, simpler.

The challenge I ran with that was, every project (and people) doesn’t have git. So it’s pretty much that but a prompt away without any git repo setup.

@paraschopra This. Half my clients team members don’t go anywhere near Git and don’t want to.

@paraschopra Yup, try it out and let me know what else can I cook here :)

Similar thing for .md if you want to save those tokens 😀

yeah this is similar but HTML gives a lot more interactivity!

This is great! But instead of having a bunch of local HTML scattered around, you can ask Claude code to build these things in MagicPath. You can even have multiple projects running in one canvas, and everything is instantly shareable with a link and interactive :)

Holy moly, literally been trying to make exactly this. My entire workflow across everything - ppt, doc, proposal, review doc, product iteration, startups slides, newsletters, blogs, has become html Tbh, between .md, .html, vs .pptx/.docx etc - .html has so many benefits at 50% or less token as .pptx or .docx; Will give this a try. Quick question: do you think this could also be a CLI / npm-style tool? Something like: npx make-pages-interactive ./report where it injects the commenting layer, launches localhost, stores comments in a structured inbox, and then any agent — Claude Code, Codex, Cursor, etc. — can read the feedback and patch the HTML. So maybe the skill is the Claude-specific interface, but the core primitive is agent-agnostic: “Google Docs comments, but for local HTML artifacts.”

yeah, just ask claude code to spin it into cli. Should be pretty simple

Next task.

very cool and super useful for charts/graphs that I generate (usually dump them as html files so I can browse through).

In Codex browser you can do this directly without the need of any skill, simply put a comment and it will change accordingly. When it comes to browser use, Codex does great job

@_svs_ i literally built this myself today as well :)

Looks neat. Will try for sure. Been using HTML for a long time. Would love if such feature can be used across multiple users -- but I understand the limitations rn.

very similar tool by @benjitaylor :

great! I made some stable components for cc using in html, so web can monitor the diff I interact with the block, and don't need to feedback with cc Manually

This is very cool!

@_svs_ Isnt this similar to /playground

Check planannotator ai My spelling might be incorrect but you can just do a googlr search

Sweet timing. Assuming this is good only for the author prompting Claude and would need some sort of a hosted solution if the team had to make joint edits / post comments i guess.

yeah, this is for self-iteration. but you could push the folder and it contains feedback as well

Thanks

My workflow may be very different but once I saw the “everything as html” wave hit. I tried it for a few days and didn’t really see any benefit but my token use went way way up. So I’m back to good old markdown files. I will periodically try it but we are moving into an AI price hike so saving tokens is a priority right up there with model usefulness

This should be native to cc

This is now native in Claude Code desktop app. Open the HTML in preview mode and you'll find the element selector on top

@sidin Built a similar version for html slides recently

You're basically showing Claude instead of telling Claude. That gap is probably bigger than it seems once you're iterating at speed.

yeah, this is 100% true

@sidin you should check out @nbaschez’s roughdraft.md

google docs for HTML

same - html's are perfect as output. we use to share them, which includes in-line comments and agents reading them back/editing

will integrate this skill, super helpful

This is actually interesting. I found out this skill and have been using it since then. Let me try your's too.

This is such a clean dev loop, switching between editor and browser really breaks my flow when prototyping robot arms, inline comments on localhost are exactly the vibe coding setup I need.

Boom!

hah. this is awesome. a colleague of mine and i built something similar in the last week! this is much more polished. where do you store the comments? can they persist when the webserver dies? we’re trying to create a lightweight google docs comment style flow for commenting on technical docs

there's stored locally in the same folder as html file. they persist

Niceeee

Static HTML survives tool churn better than any notebook. I run dashboards across 3 jurisdictions. The reports I generated 18 months ago still open today. Half the SaaS dashboards I built on are dead. The artifact outlives the generator — that's the real moat.

Does this work with OpenCode? Also, Codex brought this feature natively as an annotation feature.

very interesting find definitely will try

A better way is to use PaperOrchestra skill and convert your research into proper cited research paper
