Build single-file browser demos that measure and lay out text without DOM reflow.
npx skills add https://github.com/anxiety135790/hermes-skills --skill pretext-anxiety135790
Please help me install this Agent Skill. Skill: pretext Source: https://github.com/anxiety135790/hermes-skills/tree/main/creative/pretext Command: npx skills add https://github.com/anxiety135790/hermes-skills --skill pretext-anxiety135790
This Skill helps you build browser-based creative demos where text layout is part of the visual design, especially when words need to flow around shapes, become obstacles, or animate as geometry instead of plain paragraphs.
Ask for a single-file pretext demo that uses real prose and a dark, polished visual style, then specify the obstacle or motion you want the text to flow around.
High-intent search queries and answers about installing and using this skill.
You can flow text around moving obstacles by precomputing line metrics and applying layoutNextLineRange to measure text widths without DOM reflow, enabling smooth canvas rendering for kinetic typography.
Kinetic typography in browser demos treats text as geometry by using grapheme-aware segmentation and canvas rendering to animate shatter particles or editorial layouts within a single self-contained HTML file.
Yes, you can build generative art with editorial text layouts in a single HTML file by applying grapheme-aware segmentation and canvas rendering to create shrink-wrapped text cards and ASCII logo masking.
Measure multiline text for shrink-wrapped cards by using measureLineStats to capture precomputed line metrics, enabling grapheme-level positioning and precision layout workflows without triggering DOM reflow.
Yes, this creative typography approach supports grapheme-aware segmentation, allowing you to apply ASCII logo masking and layoutWithLines to render text-as-geometry effects directly on the canvas.
The best way to create interactive text parting around a draggable orb is using precomputed line widths with layoutNextLineRange on canvas, allowing prose to dynamically flow around moving obstacles without DOM reflow.
rickyanandaCreate single-file browser demos for measured text layout without DOM reflow.
JuanMS20Generate DOM-free text measurement and layout for browser demos.
RheasilviaMeasure and layout multiline text on HTML5 Canvas without DOM reflows.
projectedanxMeasure text and calculate line breaks on canvas without DOM reflow.
