Menu
Build self-contained interactive web applications as single HTML files. Use for creating demos, prototypes, interactive tools, and standalone web experiences that work without external servers.
Adversarially review the last 24h of multi-agent work by combining git history, GitHub issue state, generated analysis artifacts, governance tests, and duplicate-checked follow-up issue creation.
Analyze session quality trends — identify high-churn patterns, report waste, flag sessions exceeding 500 tool calls
Quick provider/model switching for Hermes CLI — aliases, fallbacks, task routing matrix, and utilization audit pattern.
Quick provider/model switching for Hermes CLI — aliases, fallbacks, task routing matrix, and utilization audit pattern.
Build complex AI systems with declarative programming, optimize prompts automatically, create modular RAG systems and agents with DSPy - Stanford NLP's framework for systematic LM programming
Mandatory planning workflow for ALL GitHub issues — plan, review, approve, then implement.
| name | web-artifacts-builder |
| description | Build self-contained interactive web applications as single HTML files. Use for creating demos, prototypes, interactive tools, and standalone web experiences that work without external servers. |
| version | 2.0.0 |
| category | _internal |
| last_updated | "2026-01-02T00:00:00.000Z" |
| related_skills | ["frontend-design","algorithmic-art","theme-factory"] |
| tags | [] |
| see_also | ["web-artifacts-builder-self-contained-architecture","web-artifacts-builder-basic-template","web-artifacts-builder-1-interactive-dashboard","web-artifacts-builder-common-cdn-libraries","web-artifacts-builder-file-naming"] |
Create self-contained, interactive web applications as single HTML files. These artifacts require no server, no build process, and can be shared as standalone files that run in any modern browser.
When the artifact is an interactive review, scoring, calibration, triage, QA, or annotation app, include a one-click Submit workflow by default. Manual JSON/CSV export-download-upload is acceptable only as a fallback; it is too convoluted as the primary user path.
Recommended pattern:
Submit button.GET /health, POST /submit) that writes timestamped submissions plus submissions/latest.json.http://127.0.0.1:<port>/submit; if unavailable, copy JSON to clipboard and show the exact receiver start command.See references/interactive-review-submit-pattern.md for implementation details and pitfalls.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Web Artifact</title>
<style>
body { font-family: system-ui; padding: 20px; }
.btn { padding: 10px 20px; background: #007bff; color: white; border: none; cursor: pointer; }
</style>
</head>
<body>
<h1>Interactive Tool</h1>
<button class="btn" onclick="calculate()">Calculate</button>
<div id="result"></div>
<script>
function calculate() {
document.getElementById('result').textContent = 'Result: ' + (Math.random() * 100).toFixed(2);
}
</script>
</body>
</html>
Use this pattern when the user needs to rate, triage, or calibrate a batch of examples in a browser instead of editing Markdown/CSV by hand.
localStorage.node --check when Node is available;'\\n') inside JavaScript; an actual newline inside a quoted JS string will make the page render shell content but fail to initialize.Starter template: templates/interactive-rating-app.html.