---
title: Typography
intro: The character of the type in XSERIES material, font candidates for the digital product (free and licensed), the size scale, and number rules for scores and stats.
updated: 1 Nov 2026
status: Hipotesis
---

> [!WARNING]
> The official XSERIES font name is **not yet known** ([V3](/research/pertanyaan-terbuka/#q-v3)). All identification below is based on visual observation of screenshots, not source files. Ask the client for the font files or brand guidelines before production. The fonts in this page's examples (Barlow Condensed and Inter) are only temporary stand-ins.

## What is visible in the material

![XS-3 FAQ](/assets/evidence/xs3-faq-cover.jpg "Headline 'HERE'S WHAT YOU NEED TO KNOW ABOUT': capital grotesk, very condensed, bold. Source: FAQ IG highlight @xseries___.")
![Player card](/assets/evidence/xs3-players-1.jpg "Player names (MISTER ALOY, SAFEE SALI, KITINGS, HAMID): bold condensed, capitals, slightly italic. Source: IG @xseries___.")

Grouping how the type is used in the material shows two voices that already exist, plus one that does not exist yet.

```viz-compare
## Voice 1: condensed
tone: stage
sub: Hard, for names and headlines
- Headline | Capital grotesk, very condensed, bold, sometimes italic. "HERE'S WHAT YOU NEED TO KNOW ABOUT", "INDONESIA ARENA"
- Player name | Bold condensed, italic, the largest size on the card. "MISTER ALOY", "SAFEE SALI"
## Voice 2: extended
tone: stage
sub: Wide, for the wordmark only
- Wordmark | Wide (extended) letters with a gradient, not a text font. "X SERIES-3"
## Voice 3: text
tone: neutral
sub: Still thin in the material, needs to be added for the digital product
- Small label | Small-capital sans with wide tracking. "CONFIRMED FOR", "SUPER SAFEE"
- FAQ body | Regular white sans on black, small size. The content of the FAQ slides
```

Conclusion: XSERIES uses **two voices**. The first is condensed and hard, for names and headlines. The second is extended, for the wordmark. The digital product needs a third voice, a sans that is comfortable for long text.

## Font candidates

These two specimens are the initial recommendation. See how the display feels hard and italic, while the text stays calm and easy to read.

```viz-fonts
## Barlow Condensed
family: 'Barlow Condensed', sans-serif
role: Display (temporary stand-in)
sample: SAFEE SALI 16–15
italic: yes
- Headlines, player names, big scores
- Many weights and italic, free (OFL)
- Replace with the official font once [V3](/research/pertanyaan-terbuka/#q-v3) is answered
## Inter
family: 'Inter', sans-serif
role: Text
sample: Cards can flip the score
- UI, news, rules, FAQ
- Tabular numbers, readable at small sizes
- Free (OFL), supports Indonesian characters
```

The full list of candidates, including licensed options:

### Display (headlines, player names, big scores)

| Font | License | Notes |
|---|---|---|
| [Anton](https://fonts.google.com/specimen/Anton) | Free (OFL) | Closest to the XS-3 headline. Only one weight |
| [Barlow Condensed](https://fonts.google.com/specimen/Barlow+Condensed) | Free (OFL) | Many weights and italic. Safe for a system |
| [Oswald](https://fonts.google.com/specimen/Oswald) | Free (OFL) | Variable font. Softer |
| [Druk](https://commercialtype.com/catalog/druk) | Licensed (Commercial Type) | The standard for premium sports posters |
| [Tusker Grotesk](https://www.thedesignersfoundry.com/tusker-grotesk) | Licensed (The Designers Foundry) | Many widths. Strong for player names |

### Text (UI, news, rules, FAQ)

| Font | License | Notes |
|---|---|---|
| [Inter](https://fonts.google.com/specimen/Inter) | Free (OFL) | Tabular numbers, very readable at small sizes |
| [Mona Sans](https://github.com/github/mona-sans) | Free (OFL) | Has widths from condensed to expanded in one family |
| [Geist](https://vercel.com/font) | Free (OFL) | Modern and neutral |

> [!TIP]
> **Initial recommendation: Barlow Condensed (display) + Inter (text).** Both are free, support Indonesian characters, have italic, and are light for the web. If there is budget, Druk or Tusker for display would feel much more premium. The decision is recorded in the [Visual decision log, interim fonts decision](/visual-direction/log-keputusan/#vd-06).

## Size scale (web)

The examples below use desktop sizes, so look at the spacing between levels, not the absolute sizes. Display (`display-*` and `title`) uses Barlow Condensed, the rest uses Inter.

```viz-typescale
- display-xl | 120/114 | 800 · mobile 56px | Safee Sali | display
- display-l | 72/70 | 800 · mobile 40px | The Unorthodox | display
- display-m | 48/48 | 800 · mobile 32px | Match schedule | display
- title | 28/32 | 700 · mobile 22px | Grim Reaper | display
- body-l | 20/30 | 400 · mobile 18px | World legends, pro players, and creators on one court. | text
- body | 16/24 | 400 · mobile 16px | A team may not hold the ball for more than 24 seconds. | text
- label | 13/16 | 600 · mobile 12px | CONFIRMED FOR · TRACKING +0.08EM | text
```

Size per device and use:

| Token | Mobile | Desktop | Use |
|---|---|---|---|
| `display-xl` | 56px | 120px | Player name on the profile page, final score |
| `display-l` | 40px | 72px | Hero headline |
| `display-m` | 32px | 48px | Section title |
| `title` | 22px | 28px | Card title, team name |
| `body-l` | 18px | 20px | Lead paragraph |
| `body` | 16px | 16px | Main text |
| `label` | 12px | 13px | Capital label, tracking +0.08em |

Rules:

- All display tokens are always in **capitals**, tracking -0.01em. The large sizes (`display-xl`, `display-l`, `display-m`) use line-height 0.9–1.0. `title` is looser (28/32, about 1.15) so two-line card titles do not collide.
- Italic is only for player names and action moments (goals, active cards). Do not use it for paragraphs.
- Long text is 70 characters per line at most.

## Numbers

Scores, stats, the shot clock, and ticket prices are the main content. The rules:

- Use **tabular numbers** (`font-variant-numeric: tabular-nums`) in stats tables and the shot clock so numbers do not shift when they change.
- Price format: `IDR 225.000` (as in GOERS material) or `Rp225.000`. These examples keep the Indonesian number format on purpose, because they describe how the product UI should show rupiah. Pick one and use it consistently.
- Big scores use the display font. Stats use the text font.

## Research basis

- FAQ, TICKET, and PLAYERS highlights on [Instagram @xseries___](https://www.instagram.com/xseries___/)
- [Google Fonts](https://fonts.google.com/), [Commercial Type](https://commercialtype.com/), [The Designers Foundry](https://www.thedesignersfoundry.com/)