skills.rest
LamseyahElias
LamseyahEliasCOMMUNITY
Explore all skills by this author →
GitHub

pretext

Measure text layout without DOM access and return per-line data.

Updated Jun 11, 2026
Search Tags:#typography#canvas#creative-coding#ascii-art#text-layout#dom-free#pretext
One-click install
npx skills add https://github.com/LamseyahElias/jarvis-cloud-v2 --skill pretext-lamseyahelias
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: pretext
Source: https://github.com/LamseyahElias/jarvis-cloud-v2/tree/main/hermes-agent/skills/creative/pretext
Command: npx skills add https://github.com/LamseyahElias/jarvis-cloud-v2 --skill pretext-lamseyahelias

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Pretext measures text without touching the DOM and provides per-line data for creative browser demos, enabling layouts that move around obstacles and render text as geometry.

Core Features & Use Cases

  • DOM-free multiline text measurement and layout for creative coding
  • Flow text around shapes, kinetic typography, and text-as-geometry demos
  • Real-world use: craft ASCII-art, editorial layouts, or games that treat words as physical elements

Quick Start

Load a sample corpus with prepareWithSegments and render a single-file HTML demo.

Frequently Asked Questions about pretext

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I measure multiline text layout without touching the DOM?▼

You measure text layout DOM-free by processing text through a layout engine that returns per-line position data. This avoids triggering browser reflow while providing the exact coordinates needed for rendering.

What is the best way to flow text around shapes in creative coding?▼

Flowing text around shapes requires measuring text boundaries against obstacle geometry to calculate per-line segment data. This returns the exact coordinates needed to wrap words dynamically around forms.

Can I generate ASCII-art layouts using DOM-free text measurement?▼

ASCII-art layouts can be generated by measuring character segments and materializing line ranges. This computes precise text positions needed to map characters into structural geometric patterns without DOM rendering.

Does DOM-free text layout work for kinetic typography and text-as-geometry demos?▼

DOM-free text layout supports kinetic typography by returning per-line data for dynamic rendering. It computes measurement segments and line ranges to treat words as physical elements in browser-based demos.

How do I prepare text segments before computing line ranges for editorial layouts?▼

Preparing text segments involves loading a corpus into a layout processor. This function splits text into measurable units, enabling the subsequent calculation of per-line ranges and positions for rendering.

Related Skills

Explore More Design & Creative Skills→
lengoctuong2005lengoctuong2005
5

pretext

Measure and layout text for DOM-free ASCII art and typography demos.

Community
Intermediate
PlaidmustachePlaidmustache

pretext

Measure and layout text without a DOM for canvas rendering.

Community
Intermediate
zeronx798zeronx798

pretext

Measure and lay out text on HTML5 Canvas using the pretext ESM module.

Community
Intermediate
CyapstayeCyapstaye
9

pretext

Measure and lay out text on canvas without DOM reflows.

Community
Advanced