mcpField
H
html

html

github.com/eliasstravikDesign & UI2156 installsUpdated 4d ago
Repository

About html

html is a skill for creating or revising a self-contained, responsive HTML interface. It specifies an artifact location, a local static server, and a verification step before handoff.

Key features

  1. 01Create or revise an HTML artifact
  2. 02Responsive, semantic interface structure
  3. 03Accessible controls
  4. 04Serve and verify the local page

Use cases

  1. 01Creating a new HTML interface
  2. 02Revising a named HTML artifact
  3. 03Checking a page locally before handoff

Install

Copy the command and run it in a terminal.

$npx skills add https://github.com/eliasstravik/skills --skill html

After installing, type/htmlin Claude Code to confirm it loaded.

Details

From the project README

HTML

Recipe

  1. Resolve ARTIFACT_DIR inside the provided HTML state root, or expanded ~/.html otherwise: revise a named artifact in place, or create a three-random-word lowercase slug for new work.
  2. Write only ARTIFACT_DIR/index.html as a complete self-contained, source-faithful, responsive interface with semantic structure and accessible controls unless the user names another entry file.
  3. Start a long-lived static server for ARTIFACT_DIR on 127.0.0.1 using a free non-common port.
  4. Verify the exact http://127.0.0.1:<PORT>/index.html with files inside the task run, retrying from step 3 on another port if binding or fetching fails, and keep the verified server alive through handoff.
  5. Reply with exactly HTML file: <absolute entry-file path> then HTML: [Open locally](<verified /index.html URL>); if serving cannot be verified, omit the link and give the path plus one concise reason.

Details

  • Run python3 -m http.server "$PORT" --bind 127.0.0.1 --directory "$ARTIFACT_DIR" as the foreground command of a long-running tool session; do not background or detach it from a shell that will exit.

Comments

Markdown supported