Fonts and Density

Your brand font is set once in your look (Geist, a Google Fonts family, or your own font file), and so is the spacing (see Spacing). The parameters on this page override them for one page.

Brand Font

The parameters below override your look's font for one page. Leave them out and the embed uses your look's font.

• With font alone, the embed loads that family from Google Fonts (weights 400 to 700).
• With font and fontUrl, the embed loads your file under that family name instead. fontUrl must be https; any other value is ignored and the family is loaded from Google Fonts by name.
• Fonts load without blocking the page: until your font arrives, and if it fails to load, the embed shows its default font (Geist), so text is never invisible.
• A font named by your page or the Host SDK loads from any https origin, whether or not your look names a font: Google Fonts for a name alone, the file's own host for fontUrl.
• A page's font overrides your look's whole font: font alone is a Google Fonts family and replaces the look's font entirely, whether the look uses Geist, a Google family or a font file; font with fontUrl is your own file.

?token=JWT&font=Poppins
?token=JWT&font=Acme%20Sans&fontUrl=https%3A%2F%2Fcdn.acme.example%2Ffonts%2Facme-sans.woff2

theme: { font: 'Acme Sans', fontUrl: 'https://cdn.acme.example/fonts/acme-sans.woff2' }

A self-hosted font file is fetched by the player's browser from inside the embed, so serve it with CORS headers that allow https://embed.prediction.phoenixverse.io.

Density

compact tightens spacing and makes text slightly smaller throughout the embed, which suits narrow placements such as a sidebar or a sportsbook betslip column. In your look this is the Spacing setting, Comfortable or Compact. Any other value is ignored, and your look's spacing shows. A later setTheme({ density }) changes it at once.

?token=JWT&density=compact