pretext

Measure, lay out, and render text with the pretext library.

5|2|Updated May 26, 2026
One-click install
npx skills add https://github.com/nyxoraAI/Nyxora --skill pretext-nyxoraai
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: pretext
Source: https://github.com/nyxoraAI/Nyxora/tree/main/packages/core/playbooks/creative/pretext
Command: npx skills add https://github.com/nyxoraAI/Nyxora --skill pretext-nyxoraai

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires @chenglou/pretext, and includes scripts (resource) and references (resource) and assets (resource) components.

What problem does it solve?

This Skill provides a powerful toolset for creating innovative text-based visual content, enabling users to craft engaging demos that leverage ASCII art, typography, and kinetic effects.

Core Features & Use Cases

  • DOM-Free Text Layout: Achieve precise text positioning and flow without the DOM, enabling unique creative designs.
  • ASCII Art & Typography: Transform text into engaging ASCII art or use typography to create dynamic and interactive effects.
  • Kinetic Typography: Implement dynamic text transformations for a visually engaging experience.
  • Use Case: Imagine you want to create an interactive website with text that reflows around an orbiting orb, using real prose and typography to create a visually striking demonstration of text-based interactivity.

Quick Start

To get started, use the pretext skill to create a text reflowing around a moving orb by running 'pretext orbit' with your chosen text and template.

Frequently Asked Questions about pretext

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

FAQPage Schema
How do I create DOM-free text layout for interactive web demos?

DOM-free text layout measures and positions text precisely without relying on the DOM, enabling unique creative designs. Canvas measurement provides the exact dimensions needed to flow and render typography dynamically for interactive demonstrations.

What is kinetic typography and how does it work for dynamic text effects?

Kinetic typography implements dynamic text transformations to create visually engaging experiences. It works by applying precise measurement and rendering techniques to animate prose, allowing text to move and reflow interactively around objects.

How do I make text reflow around a moving object using ASCII art and typography?

To make text reflow around a moving object, you can use the pretext orbit command with your chosen text and template. This calculates precise positioning to dynamically flow typography around animating elements like an orbiting orb.

Can I use canvas measurement for precise typography rendering in generative art?

Yes, canvas measurement is required for precise text layout and rendering in generative art. It calculates exact dimensions for ASCII art and typography, ensuring accurate positioning and flow for creative visual projects.

Does DOM-free text layout support real prose for educational and artistic materials?

DOM-free text layout supports real prose for educational and artistic materials. It leverages precise measurement to position actual text, enabling interactive web demos and visually striking demonstrations of text-based interactivity.

What are the limitations of using DOM-free text layout for creative text positioning?

A limitation of DOM-free text layout is that it requires canvas measurement to function, meaning it cannot operate without a canvas environment. It is specialized for creative text visualization rather than standard web content rendering.