Geist Serif Hadir: Vercel Luncurkan Typeface Serif Pertama, Gimana Rasanya?

Kabar gembira buat kamu yang suka ngutak-atik typography atau lagi cari font serif yang modern tapi nggak bikin mata lelah. Vercel — ya, tim di balik Next.js — baru saja drop Geist Serif, typeface serif pertama mereka setelah sebelumnya udah sukses bikin Geist Sans dan Geist Mono. Font ini dirancang khusus biar pas dipake bareng Geist Sans, jadi kamu bisa mix and match tanpa pusing mikirin visual consistency. Gratis pula buat komersial, jadi nggak perlu mikir lisensi kalau mau dipake buat project client atau produk sendiri.

Geist Serif hadir dengan 9 weight mulai dari Thin sampai Black, masing-masing punya italic-nya. Yang bikin beda sama font serif lain adalah dukungan variable font penuh: kamu bisa ngeset weight, optical size, dan italic angle secara kontinu via CSS `font-variation-settings`. Artinya, satu file font aja udah cukup cover kebutuhan heading, body text, caption, hingga footnote. Ukuran file pun relatif ringan berkat subsetting otomatis di CDN Vercel, jadi nggak bikin loading website kamu nge-lag.

Dirancang buat readability di layar

Tim desain Vercel bilang Geist Serif dibangun dari nol dengan fokus pada readability di layar, bukan cuma adaptasi dari font cetak. Kontras stroke-nya diatur supaya tetep jelas di resolusi rendah, serif-nya sedikit dibulatkan biar nggak terlihat tajam di pixel density standar, dan x-height-nya disamakan dengan Geist Sans supaya pas dipake bareng nggak ada pergeseran visual yang aneh. Optical size axis juga ikut kerja: di ukuran kecil, serif jadi lebih tebal dan letter-spacing sedikit dibuka; di ukuran besar, detail halus kayak ball terminal dan bracketing kelihatan lebih tajam.

Fitur OpenType-nya juga lengkap banget. Ada ligatur standar (`liga`), contextual alternates (`calt`), stylistic sets buat angka tabular (`tnum`), fraksi (`frac`), ordinal (`ordn`), hingga alternate characters kayak `ss01` buat lowercase `g` dua cerita dan `ss02` buat `Q` tanpa ekor. Semua fitur ini bisa diaktifin lewat `font-feature-settings` di CSS atau langsung dari Figma/Sketch. Buat developer, artinya nggak perlu load font terpisah buat angka tabel atau fraksi — semuanya ada di satu file variable font.

Cocok buat UI, editorial, sampai branding

Karena dirancang sepasangan dengan Geist Sans, Geist Serif paling nyaman dipake buat interface yang butuh hierarchy jelas: heading pakai Sans, body text pakai Serif, atau sebaliknya. Tapi jangan salah, font ini juga quite capable buat editorial design — artikel panjang, newsletter, dokumentasi teknis, hingga buku digital. Weight ringan kayak Light dan Regular bikin teks panjang nyaman dibaca berjam-jam, sedangkan weight tebal kayak SemiBold dan Bold cocok buat pull quote, caption gambar, atau logo mark. Beberapa early adopter di komunitas desain udah coba pake buat brand identity startup AI dan fintech, hasilnya terasa modern tapi tetap punya 'authority' klasik yang dimiliki serif tradisional.

Kalau kamu pakai Next.js, integrasinya gampang banget lewat `@vercel/geist` atau `next/font/google` (Geist Serif udah masuk ke Google Fonts). Cukup import, set `variable: '--font-geist-serif'`, dan pake di CSS via `font-family: var(--font-geist-serif)`. Untuk project non-Next, tinggal download file WOFF2 dari GitHub repo resmi atau gunakan CDN Vercel yang udah support `preload` dan `font-display: swap`. Lisensinya SIL Open Font License 1.1, artinya bebas dipakai, dimodifikasi, dan didistribusikan ulang — termasuk buat produk komersial — selama file lisensi ikut disertakan.

Komunitas respon positif, tapi ada catatan

Di Hacker News dan Twitter/X, respon mayoritas positif. Banyak dev dan desainer yang puas karena akhirnya punya opsi serif yang 'native' dengan ekosistem Vercel/Next.js. Beberapa bandingin dengan IBM Plex Serif, Source Serif, atau Literata — tapi consensus-nya Geist Serif terasa lebih kohesif kalau dipake bareng Geist Sans. Ada beberapa feedback soal kerning di kombinasi tertentu (misal `To` atau `Va` di weight tebal) yang agak longgar, tapi tim Vercel udah bilang bakal diiterasi di versi mendatang. Juga ada request buat tambahan Cyrillic extended dan Vietnamese di release berikutnya, karena saat ini cuma cover Latin Extended-A.

Buat kamu yang mau coba, cukup buka `geist.font` atau repo GitHub `vercel/geist`. Download variable font WOFF2 (sekitar 120 KB untuk semua weight), coba di Figma atau langsung di browser via dev tools. Tip cepat: aktifkan `font-optical-sizing: auto` biar optical size axis kerja otomatis mengikuti ukuran teks. Kalau butuh angka tabular di tabel data, tinggal tambah `font-feature-settings: 'tnum' 1`. Simple, clean, dan nggak bikin pusing.