sdf-text

Build and sample SDF, MSDF, and PSDF glyph atlases for canvas text rendering.

13|1|Updated Apr 6, 2026

Search Tags:#atlas #sdf #shader #text-rendering #msdf #psdf

Ready to run

npx skills add https://github.com/danielraffel/pulp --skill sdf-text

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: sdf-text
Source: https://github.com/danielraffel/pulp/tree/main/.agents/skills/sdf-text
Command: npx skills add https://github.com/danielraffel/pulp --skill sdf-text

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Solves the challenge of rendering high-quality text by building and sampling GPU-friendly SDF, MSDF, and PSDF glyph atlases, enabling crisp, scalable text across sizes.

Core Features & Use Cases

Atlas construction for single-channel and multi-channel glyphs (SDF/MSDF/PSDF)
Shader-based sampling via SkSL for crisp rendering
Shared text-layout helpers and integration with the rendering pipeline
Reference implementations and demo usage in examples/sdf-text-demo

Quick Start

Use sdf-text to build and sample the atlas pipeline for rendering text in the canvas.

Frequently Asked Questions about sdf-text

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

FAQPage Schema

What is SDF text rendering and how does it make fonts scalable?▼

MSDF (multi-channel signed distance field) glyph atlases encode distance data in RGB channels to preserve sharp corners. Single-channel SDF atlases are simpler but can blur angular features, while PSDF provides optimized rendering for specific pipeline needs.

How do I render crisp text using SkSL shaders and a glyph atlas?▼

Crisp text rendering depends on integration with SDF, MSDF, or PSDF atlas types, SdfPenSnap, and SdfTextOptions definitions. You also need the associated shader and layout utilities to correctly sample and display the atlas textures.

What's the difference between SDF, MSDF, and PSDF glyph atlases for canvas rendering?▼

SDF atlases use a single channel for distance data, while MSDF uses multiple channels to better preserve sharp corners. PSDF provides another variant for specific rendering pipeline needs, all building GPU-friendly textures for scalable text.

Does sdf-text work with the core canvas text pipeline for scalable fonts?▼

Yes, sdf-text applies directly to the core canvas text pipeline. It provides atlas construction, shader-based sampling via SkSL, and shared text-layout helpers to render scalable fonts within the canvas environment.