feat: /design-html skill — Pretext-native HTML from approved mockups (v0.14.0.0)#653
Merged
feat: /design-html skill — Pretext-native HTML from approved mockups (v0.14.0.0)#653
Conversation
New skill that takes approved design-shotgun mockups and generates production-quality HTML with Pretext for computed text layout. Text reflows on resize, heights adjust to content, zero hardcoded CSS. Includes vendored Pretext bundle (30KB), smart API routing per design type, AskUserQuestion refinement loop, framework detection, and 3-viewport verification screenshots. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- design-shotgun: Step 6 option B now chains to /design-html - design-consultation: suggests /design-html after shipping DESIGN.md (conditional on screen-level output, not tokens-only) - plan-design-review: expanded chaining to include /design-shotgun and /design-html alongside review skills Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
plan-design-review now chains to /design-shotgun and /design-html in addition to review skills. Update the assertion to match. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Main landed v0.13.10.0 (Office Hours reading list) while this branch had v0.14.0.0. Kept v0.14.0.0 (higher, new feature) and preserved both CHANGELOG entries in correct order. Updated package.json to match. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
E2E Evals: ✅ PASS7/7 tests passed | $.82 total cost | 12 parallel runners
12x ubicloud-standard-2 (Docker: pre-baked toolchain + deps) | wall clock ≈ slowest suite |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
New skill:
/design-html— takes an approved design mockup from/design-shotgunand generates production-quality Pretext-native HTML. Text reflows on resize, heights adjust to content, layouts are dynamic. The first AI design tool where text actually works correctly.Core feature:
design-html/SKILL.md.tmpl— new skill template with Pretext API cheatsheet, smart routing per design type, refinement loop, framework detection, live reload, verification screenshotsdesign-html/vendor/pretext.js— vendored 30KB Pretext source for zero-dependency HTML outputPipeline integration:
design-shotgunStep 6 option B now chains to/design-htmldesign-consultationsuggests/design-htmlafter producing screen-level designsplan-design-reviewnext steps expanded to include/design-shotgunand/design-htmlalongside review skillsTest fix:
test/gen-skill-docs.test.tsassertion for expanded chaining(gstack)keyword to design-html description for validation complianceTest Coverage
All new code paths are SKILL.md template content (prompt engineering, not application code). Validated by:
skill-validation.test.ts— auto-detects new skill, validates frontmatter, description, toolsgen-skill-docs.test.ts— validates generation, freshness, chaining, description keywordsTests: 653 pass, 0 fail across 2 test files.
Pre-Landing Review
This is a prompt template (SKILL.md.tmpl), not application code. No SQL, no auth boundaries, no LLM trust violations. The vendored
pretext.jsis a 5-line CDN redirect (actual Pretext loaded at runtime in generated HTML).Pre-Landing Review: No structural issues found.
Plan Completion
Plan file:
~/.claude/plans/fuzzy-forging-kite.mddesign-html/SKILL.md.tmpl— primary deliverabledesign-html/vendor/pretext.js— vendored Pretext sourcedesign-shotgun/SKILL.md.tmplStep 6 to chain to/design-htmldesign-consultation/SKILL.md.tmplto suggest/design-htmlplan-design-review/SKILL.md.tmplto chain to design skillsCompletion: 6/6 DONE.
Review Dashboard
Test plan
bun test— 653 pass, 0 failbun run gen:skill-docs— all SKILL.md files fresh🤖 Generated with Claude Code