What is the frontend textbooks skill?
The frontend textbooks skill is a SKILL.md in onepixelaway/frontend-textbooks that has an AI coding agent turn a manuscript into an editable HTML book and a matching US Letter PDF, with original cover artwork, a planned page rhythm and checks that preserve at least 90% of the text.
The frontend textbooks skill is a SKILL.md in onepixelaway/frontend-textbooks. It turns a manuscript into a real book: editable HTML, a Letter PDF, cover options, verified assets and evidence of manuscript preservation.
It targets textbooks, manuals, field guides, business books and coffee table books. Scripts own deterministic work such as parsing, pagination measurements, screenshots and PDF export, and the model owns judgment such as audience, typography and aesthetic approval.
How a book gets made
The workflow starts with a book.json and a Markdown manuscript, then generates a stable source inventory. The agent presents three numbered color and typography choices, marks one Recommended, and waits for your answer before planning or building.
Next the model writes a schema valid book-plan.json, the cover artwork is generated, and the book is built and verified at three tiers: fast, affected and full. Delivery includes the HTML, the PDF, an approximate page count and preservation percentages.
Rules the skill enforces
- Preserve at least 90% of the manuscript unless you explicitly request abridgment.
- Generate one original, manuscript grounded local bitmap for every cover, with no baked in typography.
- Produce HTML and PDF from the same source, on US Letter, with no clipped content.
- Keep production language such as HTML, PDF export or AI out of reader facing pages unless requested.
Who the frontend textbooks skill is for
Best for
- Turning a manuscript into a designed HTML book and a matching Letter PDF.
- Enhancing an existing HTML book or repairing its print and mobile layout.
- Field guides, manuals, business books and coffee table books where typography and page rhythm matter.
Not for
- SKILL.md asks for a book rather than a printed article, so for turning a URL, PDF, DOCX, Markdown file or pasted text into one shareable HTML article the beautiful-article skill fits.
- SKILL.md asks for a book rather than a slide deck, so for HTML prototypes, slide decks, animations and infographics the huashu-design skill fits.
- Its pages are fixed US Letter pages that also export to PDF, so for mobile-first layouts with fluid containers, relative units and shared breakpoints the frontend-responsive-ui skill fits.
- Its artwork is a required cover bitmap plus editorial images only when useful, so for a single page poster or art piece in PNG or PDF the canvas-design skill fits.
How to install Frontend Textbooks Skill: Manuscript to HTML Book and PDF
git clone https://github.com/onepixelaway/frontend-textbooks.git ~/.claude/skills/frontend-textbooks
cd ~/.claude/skills/frontend-textbooks
npm ci
npm run setup:browsers~/.codex/skills/frontend-textbooks instead and run the same npm ci and npm run setup:browsers commands.Clone the skill
Clone the repository into your agent's skills directory with the first line of the command above.
Install packages
Run
cd ~/.claude/skills/frontend-textbooksand thennpm ci. Runtime packages are pinned inpackage-lock.json.Set up browsers
Run
npm run setup:browsers. The browser runner reuses installed or cached browsers first.Ask for the skill
Ask your agent to use the frontend-textbooks skill to turn a manuscript into a print ready PDF book.
Check that it loaded
Ask your agent to use the frontend-textbooks skill on a manuscript. It should read the manuscript and present three numbered visual system choices, then wait for your answer before planning.
Key features
- Print ready PDFExports US Letter PDFs with page safe CSS, printed backgrounds and fixed format designed pages.
- HTML firstThe editable source of truth is a browser readable
index.html, and the final PDF is exported from that same HTML after layout verification. - Bundled typographyEach font bearing theme ships redistributable licensed font files, copies the active faces and licenses into the book, and renders without font network access.
- Manuscript preservationStable source blocks are tracked, and verification fails when coverage falls below 90%.
- Original cover artworkEvery run requires a unique manuscript grounded local bitmap and fails closed instead of falling back to a typographic cover.
- Designed book rhythmCovers, title pages, tables of contents, part dividers, two column reading pages, framework, scorecard and numbers exhibits, diagrams and chapter closers.
- Visual system choiceThe agent offers three numbered color and typography choices, marks one Recommended, and waits for your answer.
- Theme previewsEvery registered theme is previewed with a rendered cover and an image-led detail page, including
colbalt,alumni,field-guide,scholarly,technicalandliterary. - Tiered verificationFast builds avoid a browser, affected checks render changed pages plus mobile, and full finalization verifies desktop, print and mobile and exports the PDF.
- Batched repairsOn failure, tasks come from
.verification/repair-tasks.json, and validated repairs are applied together from onerepair-actions.json.
Frequently asked questions
What is the frontend textbooks skill?
It is a SKILL.md in the onepixelaway/frontend-textbooks repository for turning manuscripts, field guides, manuals and long form notes into designed HTML books and print ready PDFs. Your AI coding agent starts from SKILL.md and loads the referenced support files only when it needs them.
How do I install the frontend textbooks skill?
Clone the repository into ~/.claude/skills/frontend-textbooks, then run npm ci and npm run setup:browsers inside it. Codex users clone into ~/.codex/skills/frontend-textbooks instead. After that, ask your agent to use the frontend-textbooks skill to turn your manuscript into a print-ready PDF book.
What does the skill deliver?
A complete run delivers the HTML book, the PDF, an approximate page count, word and exact block preservation percentages, and any material caveats. It must have an artifact manifest with passing full verification and the exact cover asset hash before the run counts as complete.
How much of my manuscript does it keep?
At least 90% unless you explicitly request abridgment. The skill preserves order, examples, tone and vocabulary, and additive tools replace no source prose. Verification tracks stable source blocks and fails when coverage falls below 90%, and the delivery report states the word and exact block preservation percentages.
Does it make a cover?
Yes. Every cover needs one original, manuscript grounded local bitmap with no baked in typography. A gradient, generic shape, SVG, stock placeholder or remote URL does not count. If image generation is unavailable, the run stops and reports that cover generation is required.
Do I choose the colors and fonts?
Yes. After reading the manuscript, the agent presents three numbered visual system choices with role based hex swatches and a display and body typography pairing, and marks one Recommended. It waits for your answer before planning, generating artwork or building.
Do the HTML book and the PDF match?
Yes. The skill produces HTML and PDF from the same source, on US Letter, with atomic designed pages and no clipped content. The editable source of truth is a browser readable index.html, and the final PDF is exported from that same HTML after layout verification. Bundled font files keep HTML and PDF rendering deterministic and offline.