Agent skill · writing content · aiskillstore
ai-html-generate
Use AI to recreate PDF page as semantic HTML. Consumes three inputs (PNG image, parsed text, ASCII preview) for complete contextual understanding and accurate generation.
Why this skill is useful
Provides a structured approach to generating semantic HTML from complex inputs, which the AI wouldn't reliably generate on its own.
What it needs
Requires claude account access. About 9k tokens when loaded. Last updated 2026-08-07. 405 stars on the source repository.
What this skill does
AI HTML Generate Skill Purpose This skill leverages AI's probabilistic generation capabilities to recreate PDF pages as semantic HTML. The AI receives three complementary inputs that together provide complete context: 1. Visual reference (PNG image) - Page layout and visual hierarchy 2. Text data (richextraction.json) - Accurate text content and formatting metadata 3. Structural preview (ASCII text) - Logical layout and element relationships This three-input approach ensures the AI understands not just what text to include, but how it should be structured semantically in HTML. The output is probabilistic (AI-generated), but will be made deterministic by validation gates in subsequent skills. What to Do 1. Prepare three input files Load 02pageXX.png (image file) Load 01richextraction.json (text spans with metadata) Load 03pageXXascii.txt (structure preview) 2. Construct AI prompt Attach PNG image as visual reference Include extracted text data (JSON) Include ASCII preview (text representation) Provide specific generation requirements 3. Invoke Claude API with complete context Send multi-modal prompt (text + image) Request semantic HTML5 output Specify CSS classes and structure requirements 4. Parse and save generated HTML Extract HTML from AI response Validate basic well-formedness Save to persistent file with metadata 5. …
How to use it
Reference it in AdaL, Claude Code, Cursor or any coding agent — nothing to install:
@skills aiskillstore/ai-html-generate