rt url(‘https://fonts.googleapis.com/css2?family=Bona+Nova+SC:ital,wght@0,400;0,700;1,400&family=Kode+Mono:wght@400;500;600;700&family=PT+Serif:ital,wght@0,400;0,700;1,400;1,700&family=Roboto:ital,wght@0,300;0,400;0,500;0,700;0,900;1,400&display=swap’);

Fonts in ProntoGUI

ProntoGUI ships with four bundled font families that you can use in any text-bearing primitive by setting the fontFamily property. Weight and italic styling are controlled separately via fontWeight and fontStyle.

How to Use a Font

Set these properties on a text primitive’s embodiment:

Property Values
fontFamily One of the family names listed below
fontSize Size in logical pixels (e.g. 14, 18, 24)
fontWeight 100, 200, 300, 400 (normal), 500, 600, 700 (bold), 800, 900 — limited to weights the family ships
fontStyle normal or italic (italic only if the family ships italics)

If a requested weight or style is not available for the chosen family, the closest available variant is substituted.

Available Families

Roboto

A modern, neutral sans-serif. The default choice for UI text — ships with the widest range of weights and matching italics.

The quick brown fox jumps over the lazy dog. 0123456789

Light — 300

Regular — 400

Medium — 500

Bold — 700

Black — 900

Regular Italic


PT Serif

A readable transitional serif. Good for long-form text, headings, or anywhere you want a more traditional feel.

The quick brown fox jumps over the lazy dog. 0123456789

Regular — 400

Bold — 700

Regular Italic

Bold Italic


Bona Nova SC

A small-caps display serif. Best reserved for titles, section headings, callouts, and decorative labels — not body text.

The quick brown fox jumps over the lazy dog. 0123456789

Regular — 400

Bold — 700

Regular Italic


Kode Mono

A geometric monospace. Use for code, terminal output, tabular numeric data, or any UI where fixed-width alignment matters.

The quick brown fox jumps over the lazy dog. 0123456789

Regular — 400

Medium — 500

SemiBold — 600

Bold — 700

Choosing a Font

If you need… Try…
Default UI text, labels, buttons Roboto
Readable long-form / document body PTSerif
Decorative headings or titles BonaNovaSC
Code, logs, numeric columns KodeMono

Rendering Notes

  • The inline previews above use HTML <p> tags with CSS font-family declarations. They render accurately when the viewer has the font installed or when the markdown is rendered by a tool that loads Google Fonts. On plain GitHub rendering, the styles fall back to the platform default — follow the Specimen link to see the real typeface.
  • Inside the ProntoGUI app itself, the fonts are bundled with the application, so they render identically on every platform regardless of what the host system has installed.

Tips

  • Use the family name exactly as shown (Roboto, PTSerif, BonaNovaSC, KodeMono) — it is case-sensitive and has no spaces.
  • Requesting an unavailable weight (e.g. weight 300 on PTSerif) falls back to the nearest available weight.
  • Mixing families within a single screen is fine, but keep it to two at most (for example Roboto for UI chrome and KodeMono for code) to maintain visual consistency.