pretext

Pretext Skill

An AI agent skill that helps developers use @chenglou/pretext — the 15KB TypeScript library that computes exact text metrics without DOM reflows.

Uses the open Agent Skills standard. Works with Claude Desktop, Claude Cowork, Claude Code, Codex CLI, Cursor, Windsurf, Manus, ChatGPT, and any other compatible tool.

What It Does

Pretext computes exact text dimensions using pure math — no DOM reflows. This skill teaches AI agents how to use it correctly, covering:

• API usage — all 8 exported functions with correct argument order and types
• Critical gotchas — the lineHeight-must-be-pixels bug, argument order, font loading timing
• Integration patterns — wrapper modules, auto-fit font size, height estimation, text around obstacles
• Creative patterns — ASCII art, editorial layouts, shrink-wrap chat bubbles, 3D text wrapping, streaming AI chat
• When NOT to use Pretext — CSS-only solutions, HTML content, fragile virtualizer integrations

Installation

Claude.ai (Web)

1. Download pretext-skill.zip
2. Click Customize in the sidebar
3. Go to Skills and click +
4. Choose Upload a skill and upload the zip file

Claude Desktop

— or install manually —

1. Click Customize in the sidebar
2. Click Browse Plugins
3. Go to the Personal tab and click +
4. Choose Add marketplace
5. Type yaniv-golan/pretext-skill and click Sync

Claude Code (CLI)

From your terminal:

claude plugin marketplace add https://github.com/yaniv-golan/pretext-skill
claude plugin install pretext@pretext-marketplace

Or from within a Claude Code session:

/plugin marketplace add yaniv-golan/pretext-skill
/plugin install pretext@pretext-marketplace

Cursor

1. Open Cursor Settings
2. Paste https://github.com/yaniv-golan/pretext-skill into the Search or Paste Link box

Manus

1. Download pretext-skill.zip
2. Go to Settings -> Skills
3. Click + Add -> Upload
4. Upload the zip

ChatGPT

Note: ChatGPT Skills are currently in beta, available on Business, Enterprise, Edu, Teachers, and Healthcare plans only.

1. Download pretext-skill.zip
2. Upload at chatgpt.com/skills

Codex CLI

Use the built-in skill installer:

$skill-installer https://github.com/yaniv-golan/pretext-skill

Or install manually:

1. Download pretext-skill.zip
2. Extract the pretext/ folder to ~/.codex/skills/

Any Agent (npx)

Works with Claude Code, Cursor, Copilot, Windsurf, and 40+ other agents:

npx skills add yaniv-golan/pretext-skill

Other Tools (Windsurf, etc.)

Download pretext-skill.zip and extract the pretext/ folder to:

• Project-level: .agents/skills/ in your project root
• User-level: ~/.agents/skills/

Usage

The skill auto-activates when you mention pretext, @chenglou/pretext, text measurement without DOM, auto-fit font size, layoutNextLine, or text around obstacles. Examples:

I need to measure text height without triggering a reflow

How do I auto-fit a headline to 3 lines using pretext?

Help me flow text around a circular image using layoutNextLine

What Pretext Is