Dev Video 02: Creating a Bitmap Font for Phaser
In this video we will take a font file (one with a TTF extension) and convert it into a bitmap font (XML and PNG files) for use with the Phaser game engine.

In particular we will use a Bitmap font (non anti-aliased) which we find on the website We will then load the font into a tool called Bitmap Font Generator by AngelCode. There are a few setting which need to be changed so that the font will export properly. Once we save the font we'll need to rename and edit the XML file and its associated image. We also need to do some light post-processing on the PNG file to fix colors and transparency. Finally we load the font into a very simple Phaser project.


Thomas Hunter II released this post 14 days early for $1 patrons.   Become a $1 patron
Tier Benefits
Pledge $0 or more per month
Pledge $0.01 or more per month
Patrons Only
$1 or more per month 0 patrons
* Receive a code to disable in-game advertisements.

* Ability to download game songs in MP3 format.

* Early access to game-dev blog posts and general announcements.

Death Knight
$5 or more per month 2 patrons
* Everything in previous tiers.

* Ability to download game songs in FLAC and high bitrate MP3.

* Ability to vote in polls such as upcoming post topics and game features.

$10 or more per month 1 patron
* Everything in previous tiers.

* Your name will be listed in actively-maintained games.

* You will receive early access to games in cross-platform HTML5 format.

Recent Posts