stills

Installation
SKILL.md

Stills

Every still is one HTML page; every element is a layer you can move, restyle or swap. Chrome renders it, the brand pack styles it, and every size is its own layout rather than a scaled copy.

node /workspace/tools/html2png.mjs projects/<slug>/still/comp.html --out projects/<slug>/renders \
  --name launch --size 1200x627 --size 1080x1080 --size 1080x1350 \
  --require-font "<display family>" --require-font "<text family>" [--format png|jpeg|webp] [--quality 90] [--scale 2]
node /workspace/tools/html2pdf.mjs --html projects/<slug>/doc/doc.html --out projects/<slug>/renders/doc.pdf \
  --size 8.5x11in --brand-fonts

html2png writes <out>/<name>-<W>x<H>.<ext> per size and prints one JSON line. Each size is a fresh load at that viewport, so media queries, vw/vh and container queries recompose the layout. A required font that does not paint, a page error or a failed asset writes nothing and exits 1; fix the page. --brand-fonts requires the lead face of each brand stack instead of naming families. Exit 2 is a tooling failure: report it. Paged PDFs always go through html2pdf, never a hand-rolled page.pdf() (it rounds glyph advances and clumps tracked type).

Installs
3
GitHub Stars
548
First Seen
7 days ago