Foundations

A game voice

Two cuts of one family. Barlow Condensed, heavy and in capitals, for everything a player glances at — titles, tabs, buttons, numbers. Barlow for everything they read.

The display voice

font-display: Barlow Condensed 700 in capitals. Pair it with a display size ortext-label for menu labels.
text-display-1 · 6rem / 0.9

Los Santos bekliyor

text-display-2 · 4.5rem / 0.92

Los Santos bekliyor

text-display-3 · 3rem / 0.95

Los Santos bekliyor

Turkish pages need lang="tr"

Capitals map letters by the document language. Under lang="en" “bekliyor” sets as BEKLIYOR; under lang="tr" it is BEKLİYOR. Set it on <html> in every Turkish surface.

HUD text

Over footage, labels take text-hud — a tight dark halo that holds on any frame — and numbers take tabular-nums so a changing figure does not jitter.
$15,150EBuzdolabı

Emphasis is colour

An em inside a display title turns the accent — SectionHeading does this for you. Glow it with text-glow for a hero.

Kendi hikâyeni yaz

Weights

500Şehir uyanıyor
600Şehir uyanıyor
700Şehir uyanıyor
800Şehir uyanıyor

Body: Barlow

Tailwind’s own scale, unchanged. Barlow’s open shapes keep long Turkish lines readable at small sizes.
text-xsKarakterini yarat, mesleğini seç, şehirde iz bırak.
text-smKarakterini yarat, mesleğini seç, şehirde iz bırak.
text-baseKarakterini yarat, mesleğini seç, şehirde iz bırak.
text-lgKarakterini yarat, mesleğini seç, şehirde iz bırak.
text-xlKarakterini yarat, mesleğini seç, şehirde iz bırak.

Why Barlow Condensed

The same menu line in each candidate. Every one is free, on Google Fonts, and carries the Turkish letters.

Barlow Condensed

Envanter · $15,150

Şehre gir — Kapıyı kilitle

Chosen. A plain, legible grotesk, narrow enough for a HUD; the closest free voice to GTA VI’s prompts. Ships a matching Barlow for body text.

Saira Condensed

Envanter · $15,150

Şehre gir — Kapıyı kilitle

Squarer, more technical. Strong in headings, colder in long labels.

Chakra Petch

Envanter · $15,150

Şehre gir — Kapıyı kilitle

Cut corners, sci-fi. Distinctive, but it reads as a shooter, not a city.

Oswald

Envanter · $15,150

Şehre gir — Kapıyı kilitle

Familiar from a thousand FiveM menus — which is the problem.

Loading the fonts

Each app loads them itself

The preset reads var(--font-display) and var(--font-sans), falling back to the family names. The hub sets both with next/font; the webview with @font-face. Load the latin-ext subset — Turkish needs it.
app/layout.tsx
import { Barlow, Barlow_Condensed } from 'next/font/google';

const barlow = Barlow({
  subsets: ['latin', 'latin-ext'],
  weight: ['400', '500', '600', '700'],
  variable: '--font-sans',
});
const barlowCondensed = Barlow_Condensed({
  subsets: ['latin', 'latin-ext'],
  weight: ['500', '600', '700', '800'],
  variable: '--font-display',
});

<html className={`${barlow.variable} ${barlowCondensed.variable}`}>…</html>