Loading skill
Install any skill in seconds. Free to start, no credit card required.
Get Started Free →notque/html-artifact
Generate rich self-contained HTML artifacts instead of markdown. Auto-detects artifact shape (spec, code-review, prototype, report, editor, data-viz, diagram, deck) and loads shape-specific patterns. Bundles Birchline design system with 4 theme presets.
Passed 13 of 18 test cases with the skill, and 6 of 18 without it.
and 9 more in the full report
10 fixed6 passed either way5 still failing1 broke
Tokens, turns and time describe resource use, not a dollar price.
One of 10 test cases the skill fixed. Same model, same prompt, with and without the skill.
When running to-pdf.py, the script exits with code 2 because Playwright is not installed on the system. What installation command should be presented to the user?
| Checked | Without skill | With skill |
|---|---|---|
| Provide the installation hint pip install -e .[pdf] && playwright install chromium. | Missed | Passed |
The instructions your model reads when the skill loads.
Generate single self-contained .html files that replace markdown when the output needs color, interactivity, layout, or visualization. Auto-detect artifact shape from the request, load shape-specific patterns, generate, validate, deliver.
Core constraint: Every artifact is ONE .html file. All CSS in <style>, all JS in <script>. No CDN links, no frameworks, no build steps, no external dependencies. Works offline, opens in any browser.
5-phase pipeline: DETECT SHAPE, LOAD CONTEXT, GENERATE, VALIDATE, DELIVER. Phase 1 classifies the request into one of 8 shapes via deterministic script. Phase 2 loads the Birchline design system plus shape-specific reference. Phase 3 dispatches a subagent to generate the HTML. Phase 4 validates structure. Phase 5 delivers the file path and offers browser preview. Phase 6 EXPORT (optional) renders to PDF when the user asks for one.
Before detecting a shape, check whether the request names or matches a saved template. A saved template is a frozen, human-authored layout; cloning it beats regenerating structure because the layout cannot drift.
Run: python3 skills/meta/html-artifact/scripts/fill-template.py --list
If the request names a listed template (e.g. "project kickoff", "business review", "system design") or clearly matches one:
templates/saved/<name>.slots.json to learn the slots.fill-template.py --template <name> --slots <file> --out <artifact>.The fill script fails loud on a missing required slot, an undeclared slot name, or a leftover marker. Fix the slot JSON; do not edit the template.
If no saved template matches, continue to Phase 1.
See "Fidelity & Authority" below for the content-vs-layout rule that governs clone mode.
Classify the user's request into one of 8 artifact shapes.
test cases passed, vs 6 / 18 without
Published skills whose descriptions closely match this one, with their headline benchmark lift.
More skills from the same source and nearby in the registry, with their headline benchmark lift.