InstallBitmapFontOptions

Defined in: packages/renderer/src/assets.ts:295

Options for installBitmapFont.

Properties

chars?

optional chars?: string | (string | string[])[]

Defined in: packages/renderer/src/assets.ts:309

Character set to bake. Accepts Pixi’s range syntax, e.g. [["a", "z"], ["A", "Z"], "0123456789 .,!?"]. Defaults to Pixi’s alphanumeric set — remember to include a space.

---

family?

optional family?: string

Defined in: packages/renderer/src/assets.ts:329

@font-face family the loaded .ttf registers under. Defaults to name, so the loaded face and the baked bitmap font share one coherent identifier.

---

name

name: string

Defined in: packages/renderer/src/assets.ts:301

Name to register the baked font under. This is what you pass as style.fontFamily (alongside bitmap: true) on UIText / TextComponent, and what installBitmapFont returns.

---

padding?

optional padding?: number

Defined in: packages/renderer/src/assets.ts:316

Glyph padding in the atlas. Default 4.

---

resolution?

optional resolution?: number

Defined in: packages/renderer/src/assets.ts:314

Atlas resolution multiplier. 2 keeps glyphs crisp when the text is upscaled by a pixel-art camera. Default 2.

---

size?

optional size?: number

Defined in: packages/renderer/src/assets.ts:303

Glyph size (px) to bake the atlas at. Default 32.

---

style?

optional style?: Partial<TextStyleOptions>

Defined in: packages/renderer/src/assets.ts:323

Extra TextStyle props baked into every glyph (fill, stroke, weight, drop shadow…). fontFamily / fontSize are managed by this helper. fill defaults to white so per-text fill / tint can recolour the glyphs — set it explicitly to bake a fixed colour instead.

---

variants?

optional variants?: BitmapFontVariant[]

Defined in: packages/renderer/src/assets.ts:352

Bake weight/style emphasis atlases alongside the base font from the same source .ttf, so a BitmapText whose style.fontWeight/fontStyle asks for bold or italic renders from the matching synthetic atlas instead of being ignored (canvas Text honours those props; plain BitmapText does not).

Every variant is baked through the same pipeline as the base, then has its baseline metrics aligned to the base atlas — so a bold span and regular text sit on one shared baseline with no vertical drift. Variants register under derived names ("<name> bold", "<name> italic", …); you never name them yourself. Just set style.fontWeight: "bold" on a BitmapText using this font and the bold atlas is selected automatically.

await installBitmapFont("fonts/Body.ttf", {
  name: "Body",
  variants: [{ fontWeight: "bold" }, { fontStyle: "italic" }],
});
// <BitmapText style={{ fontFamily: "Body", fontWeight: "bold" }} /> → bold atlas