About

AngelCode BMFont exports font metrics as XML. Many game engines and rendering frameworks require JSON instead. Manually restructuring char entries with attributes like x, y, width, height, xoffset, yoffset, and xadvance across hundreds of glyphs is error-prone. A mistyped id value or dropped kerning pair breaks text rendering at runtime with no obvious diagnostic. This tool parses BMFont XML via the browser's native DOMParser, extracts every attribute with correct integer coercion, and outputs valid JSON matching the format expected by frameworks like Pixi.js, Phaser, and CocoonJS.

The converter handles all BMFont XML elements: info (face, size, charset metadata), common (lineHeight, base, scale dimensions), pages (texture atlas references), chars (per-glyph metrics), and kernings (pair adjustments). Numeric attributes are coerced to integers automatically. Padding and spacing arrays are preserved as comma-separated strings or split into arrays depending on output mode. The tool processes files entirely client-side. Nothing leaves your browser.

Formulas

The conversion follows a deterministic mapping from XML DOM to JSON object. No mathematical formula is involved. The logic is a structural transformation.

parse(xmlString) → DOMTree

extract(DOMTree, tagName) → [element₀, element₁, …, element_n]

For each element: attributes(element) → { key_i: coerce(value_i) }

Type coercion rule:

{

parseInt(v) if v matches /^-?\d+$/v otherwise (kept as string)

where v = raw attribute value from XML, DOMTree = browser-native DOM representation, tagName ∈ {info, common, page, char, kerning}.

Reference Data

BMFont XML Element	Key Attributes	JSON Output Key	Type	Description
info	face, size, bold, italic, charset, unicode, stretchH, smooth, aa, padding, spacing	info	Object	Font metadata: name, render size, style flags
common	lineHeight, base, scaleW, scaleH, pages, packed	common	Object	Shared metrics: line spacing, texture atlas dimensions
page	id, file	pages	Array	Texture atlas page references
char	id, x, y, width, height, xoffset, yoffset, xadvance, page, chnl	chars	Array	Per-glyph bounding box and advance metrics
kerning	first, second, amount	kernings	Array	Pair kerning adjustments between two glyph IDs
Attribute: id	-	id	Integer	Unicode code point for the glyph
Attribute: x	-	x	Integer	Left edge in texture atlas (pixels)
Attribute: y	-	y	Integer	Top edge in texture atlas (pixels)
Attribute: width	-	width	Integer	Glyph width in texture (pixels)
Attribute: height	-	height	Integer	Glyph height in texture (pixels)
Attribute: xoffset	-	xoffset	Integer	Horizontal offset when rendering
Attribute: yoffset	-	yoffset	Integer	Vertical offset from line top
Attribute: xadvance	-	xadvance	Integer	Cursor advance after glyph (pixels)
Attribute: lineHeight	-	lineHeight	Integer	Distance between baselines (pixels)
Attribute: base	-	base	Integer	Baseline offset from top of line (pixels)
Attribute: scaleW	-	scaleW	Integer	Texture atlas width (pixels)
Attribute: scaleH	-	scaleH	Integer	Texture atlas height (pixels)
Attribute: padding	-	padding	String/Array	Glyph padding: up,right,down,left
Attribute: spacing	-	spacing	String/Array	Glyph spacing: horizontal,vertical

Frequently Asked Questions

The converter supports the standard AngelCode BMFont XML format as output by BMFont versions 1.9 through 1.14+. It expects the root element containing , , , , and optionally child elements. Both self-closing tags () and explicit closing tags are handled correctly by the browser's DOMParser.

Every attribute value is tested against the pattern /^-?\d+$/. If the value consists entirely of digits with an optional leading minus sign, it is coerced to a JavaScript integer via parseInt(). All other values, including padding strings like "2,2,2,2", font face names, and file paths, remain as strings. This matches the behavior of the original Node.js xml2json-bmfont tool.

No. If the XML contains no element or it is empty, the output JSON will include an empty kernings array ("kernings": []). The converter never omits structural keys. Frameworks like Pixi.js expect the kernings key to exist even when empty, so this prevents undefined reference errors at runtime.

No. This tool specifically handles the XML export format from BMFont. The text format (space-delimited key=value lines) uses a different structure. If your file starts with "info face=" instead of "<?xml " or "", you have the text format. You would need to export from BMFont again using the XML option, or use a separate text-format parser.

Each element inside is extracted as a separate object with its id and file attributes. The JSON output includes all pages in the pages array ordered by their appearance in the XML. Each char entry retains its page attribute (an integer) referencing the correct atlas page index. Multi-page fonts with 2, 4, or more texture sheets are fully preserved.

DOMParser can handle XML documents up to several megabytes efficiently. Typical BMFont XML files for game fonts range from 10 KB to 500 KB (covering 200-2000 glyphs). Files exceeding 5 MB may cause brief UI freezes during parsing, but will still convert correctly. The practical limit depends on available browser memory, typically around 50-100 MB of raw XML text.