Text with Fallback Font

This example demonstrates how to specify a comma-separated list of fallback fonts for a Text object to ensure it renders correctly if the primary font is missing.

800 × 600

GitHub

class Example extends Phaser.Scene
{
    create ()
    {
        this.add.text(100, 100, 'Hello World', { fontFamily: 'Verdana, "Times New Roman", Tahoma, serif', fontSize: 64, color: '#ffffff' });
    }
}

const config = {
    scale: { mode: Phaser.Scale.FIT },
    type: Phaser.AUTO,
    width: 800,
    height: 600,
    parent: 'game-container',
    scene: Example
};

const game = new Phaser.Game(config);

More in Text29 examples

Word WrapDemonstrates various word wrapping techniques for Text objects, including basic width-based wrapping, advanced wrapping with whitespace trimming, and custom wrapping callbacks for manual control.

Word Wrap by CallbackDemonstrates how to use a custom callback function to define your own logic for word-wrapping text.

Word Wrap By WidthDemonstrates how to wrap text by a specified pixel width, highlighting the differences between basic wrapping and advanced wrapping for whitespace handling and long words.

Basic TextCreate text objects using default settings, style configuration objects, or method chaining to set font properties like family, size, and color.