Generate DOM-free text measurement and layout for browser demos.
npx skills add https://github.com/JuanMS20/solviora-agent --skill pretext-juanms20
Please help me install this Agent Skill. Skill: pretext Source: https://github.com/JuanMS20/solviora-agent/tree/main/skills/creative/pretext Command: npx skills add https://github.com/JuanMS20/solviora-agent --skill pretext-juanms20
Pretext provides DOM-free text measurement and layout so you can build creative browser demos without relying on DOM reflow, enabling precise, per-glyph positioning and flow around shapes.
It offers two main use cases: flowing text around obstacles (e.g., circular or polygonal regions), and rendering text as geometry for generative art, kinetic typography, and ASCII-art style demos. It supports single-file HTML demos and a tiny, dependency-light workflow, with optional templates and reference patterns to accelerate development.
Create a single-file HTML demo that uses pretext to render a creative, DOM-free text layout.
High-intent search queries and answers about installing and using this skill.
DOM-free text layouts for browser demos are generated using the pretext API to measure text and position glyphs precisely without relying on DOM reflow. You can apply this to flow-around-obstacle layouts, text-as-geometry visuals, and ASCII-art typography in standalone HTML files.
Flowing text around obstacles in HTML5 canvas is handled by pretext using prepareWithSegments and layoutNextLineRange to calculate line ranges that wrap around polygonal or circular regions. This enables precise generative text layout without DOM dependencies.
Kinetic typography and ASCII-art visuals can be created in a single-file HTML demo by using pretext to render text as geometry. The API supports dependency-light workflows and optional reference patterns to accelerate standalone generative art development.
Pretext requires no external dependencies to perform generative text layout. It operates DOM-free using its own API for text measurement and positioning, though optional support directories and templates can be added for extended functionality.
Precise per-glyph positioning matters for creative coding typography because it allows you to treat text as geometry independent of DOM reflow constraints. Pretext enables this by measuring and materializing individual glyph ranges for kinetic and generative visual effects.
zeronx798Measure and lay out text on HTML5 Canvas using the pretext ESM module.
juliuss1907Generate interactive HTML demos with ASCII art and kinetic typography.
zaiyemeiyou404Create text-based visual effects and interactive demos with the pretext library.
InverterNetworkMeasure and lay out multiline text on HTML5 Canvas without DOM reflow.
