text-and-bitmaptext

Render and manage styled Text and BitmapText in Phaser 4 for dynamic UI.

Updated Apr 26, 2026
One-click install
npx skills add https://github.com/kehwar/pixi-square --skill text-and-bitmaptext-kehwar
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: text-and-bitmaptext
Source: https://github.com/kehwar/pixi-square/tree/main/.agents/skills/text-and-bitmaptext
Command: npx skills add https://github.com/kehwar/pixi-square --skill text-and-bitmaptext-kehwar

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Phaser 4 game UIs often require flexible text rendering and performant text rendering paths for dynamic content. This skill consolidates the patterns for using Text, BitmapText, web fonts, and text styling to deliver clean, responsive UI.

Core Features & Use Cases

  • Text rendering options: Canvas-based Text, BitmapText, DynamicBitmapText, and retro fonts with padding and alignment.
  • Styling and typography: Word wrap, alignment, letter and line spacing, font loading considerations, and performance trade-offs between Text and BitmapText.
  • Use cases: HUDs, menus, scores, dialogue, and tutorials in Phaser 4 games.

Quick Start

Create a Phaser scene that renders styled Text and BitmapText to display dynamic UI elements.

Frequently Asked Questions about text-and-bitmaptext

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

FAQPage Schema
How do I render styled text and bitmap text in Phaser 4 for dynamic UI?

To render styled text and bitmap text in Phaser 4, use Text, BitmapText, and DynamicBitmapText objects with TextStyle-based styling for dynamic UI elements like scores and menus. You can apply web fonts, word wrap, alignment, and padding.

What's the best way to display game HUDs and dialogue with word wrap in Phaser?

Displaying game HUDs and dialogue in Phaser uses canvas-based Text and BitmapText objects configured with TextStyle. This approach supports word wrap, alignment, and letter spacing to deliver clean, responsive UI for dynamic content.

When should I use BitmapText vs canvas-based Text in Phaser games?

Use BitmapText or DynamicBitmapText in Phaser games when you need performant text rendering paths for dynamic content. Canvas-based Text offers flexible typography with web fonts, while BitmapText handles performance trade-offs better for frequently updating UI elements.

Does Phaser 4 support web fonts and DynamicBitmapText for in-game elements?

Yes, Phaser 4 supports web fonts and DynamicBitmapText for in-game elements. You can apply TextStyle-based styling to Text and BitmapText objects, with specific font loading considerations to ensure proper rendering of scores, menus, and tutorials.

Why does my Phaser text rendering have performance issues with frequently updating scores?

Phaser text rendering performance issues with frequently updating scores often stem from using canvas-based Text instead of BitmapText. Switching to BitmapText or DynamicBitmapText provides a more performant text rendering path for dynamic UI content.