pixijs-scene-text

Render and animate text in PixiJS v8 across multiple rendering paths.

302|15|Updated Apr 1, 2026
One-click install
npx skills add https://github.com/pixijs/pixijs-skills --skill pixijs-scene-text
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: pixijs-scene-text
Source: https://github.com/pixijs/pixijs-skills/tree/main/skills/pixijs-scene-text
Command: npx skills add https://github.com/pixijs/pixijs-skills --skill pixijs-scene-text

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

PixiJS Scene Text provides a unified set of text rendering tools for PixiJS v8, enabling developers to render high-quality text and animate it across scenes using multiple rendering paths (Text, BitmapText, HTMLText, SplitText, SplitBitmapText).

Core Features & Use Cases

  • Text: high-fidelity canvas-based rendering for static labels.
  • BitmapText: fast updates with glyph atlas for scores, timers, and dynamic labels.
  • HTMLText: rich HTML/CSS formatting via SVG foreignObject for complex layouts.
  • SplitText: per-character/word/line segmentation for per-segment animation.
  • SplitBitmapText: per-character animation using bitmap glyphs for large strings.
  • Use cases include UI labels, game HUDs, animated titles, and rich typography in PixiJS scenes.

Quick Start

Create a Text instance, add it to the stage, and apply per-character animation or split layouts as needed.

Frequently Asked Questions about pixijs-scene-text

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

FAQPage Schema
How do I animate text per-character in PixiJS v8?

SplitText and SplitBitmapText segment text into characters, words, or lines for per-segment animation in PixiJS v8. This enables structured composition and dynamic per-character effects within the scene graph.

What is the best way to render dynamic game HUDs and timers in PixiJS?

BitmapText is the best way to render dynamic game HUDs and timers in PixiJS, using a glyph atlas for fast updates and high performance when displaying frequently changing labels like scores.

Can I use HTML and CSS formatting for complex text layouts in PixiJS?

Yes, HTMLText renders rich HTML and CSS formatting in PixiJS via an SVG foreignObject, enabling complex text layouts and styled typography directly within the canvas scene graph.

Does PixiJS v8 support splitting bitmap glyphs for large string animations?

Yes, SplitBitmapText supports splitting bitmap glyphs for large string animations in PixiJS v8, combining glyph atlas performance with per-character animation capabilities for efficient rendering.

When should I use HTMLText instead of standard Text in PixiJS?

Use HTMLText instead of standard Text when you need rich HTML/CSS formatting and complex layouts in PixiJS. Standard Text provides high-fidelity canvas-based rendering better suited for static labels.