Rekomendasi Font untuk Text Editor dan IDE

Rian Yulianto W
JavaScript Indonesia Community
6 min readSep 22, 2019
Font kode dengan ligature dan monospace

Font adalah suatu gaya tampilan dari huruf yang terdapat dalam tulisan teks. Gaya tampilan huruf dapat berbeda-beda sesuai dengan representasi pembuat dan tujuan yang ingin dicapai. Perbedaan gaya tampilan huruf bisa berupa ketebalan huruf, gaya garis karakter huruf, tinggi huruf, dan sebagainya.

Dalam dunia pemrograman aplikasi, pengembang tidak lepas dari alat pemrograman yang bernama text editor dan Integrated Development Environment (IDE). Dan pastinya di dalam text editor dan IDE itu, kita selalu berinteraksi dengan teks yang ditulis dalam bentuk kode. Kenyamanan dalam membaca dan menerjemahkan kode yang telah ditulis ditentukan salah satunya oleh Font yang dipakai di dalam text editor dan IDE. Font yang baik akan membuat tulisan kode menjadi lebih mudah dibaca dan tidak membuat mata terlalu tegang dan tidak cepat lelah.

Beberapa font ada yang dibuat khusus untuk mempermudah dalam membaca tulisan berbentuk kode sumber aplikasi. Font-font ini memiliki gaya garis (weight) dengan gaya jeda (spacing) yang halus dan nyaman di mata, yang biasa disebut dengan jenis font monospace. Beberapa font ada yang dilengkapi dukungan membaca karakter berupa simbol dan karakter khusus kode (ligatures). Berikut adalah font-font yang penulis sudah coba dan cukup nyaman dipakai.

Iosevka

Font Iosevka memiliki gaya yang rapat dan tinggi. Font ini dilengkapi dengan ligature sehingga simbol operasi kode seperti ≥ , ≤ , ==, dst menjadi lebih mudah dibaca. Font Iosevka memiliki beberapa varian yang mengambil dasar dari tampilan Font lainnya. Varian ini dapat dilihat pada halaman pengunduhan di Github Font Iosevka.

Contoh font Iosevka

Demo font Iosevka dapat diakses pada tautan halaman ini
https://app.programmingfonts.org/#iosevka
Sedangkan untuk mengunduh font ini dapat diakses pada link berikut
https://github.com/be5invis/Iosevka

Ubuntu Mono

Font ini adalah font monospace pada sistem operasi Linux. Font ini otomatis dipakai ketika kita menjalankan Terminal ataupun text editor di Linux. Font ini tidak dilengkapi dengan ligature untuk simbol di dalam kode.

Contoh font Ubuntu Mono

Unduh font Ubuntu Mono ini disini
https://design.ubuntu.com/font/
Demo untuk font Ubuntu Mono dapat diakses pada tautan berikut
https://app.programmingfonts.org/#ubuntu

Fira Code

Fira Code adalah font yang populer di kalangan pengembang aplikasi. Font ini dilengkapi dengan ligature yang cukup lengkap untuk simbol-simbol di dalam teks kode.

Contoh ligature di dalam Fira Code
Contoh font Fira Code

Font Fira Code dapat diunduh pada tautan berikut ini.
https://github.com/tonsky/FiraCode
Sedangkan untuk demo dalam penggunaannya dapat dilihat di bawah ini.
https://app.programmingfonts.org/#firacode

Hack

Hack adalah font monospace yang didesain khusus untuk tampilan teks kode sumber aplikasi. Hack didesain dan dibuat dari awal dengan kolaborasi bersama pengembang kode. Sehingga dihasilkan font yang halus dan cantik ketika dipakai untuk menampilkan teks kode. Namun sayangnya font ini tidak dilengkapi ligature untuk tampilan simbol di dalam kode.

Font Hack untuk tampilannya

Font Hack ini dapat diunduh pada tautan berikut ini
https://sourcefoundry.org/hack/
Sedangkan untuk demo font Hack dapat dilihat disini
https://app.programmingfonts.org/#hack

Source Code Pro

Font ini dibuat oleh Adobe sebagai font utama untuk text editor Brackets buatan mereka. Tampilan font ini dapat dilihat di gambar bawah ini.

Contoh font Source Code Pro

Font ini dapat diunduh di
https://github.com/adobe-fonts/source-code-pro
Demo penggunaan font Source Code Pro dapat dilihat pada tautan berikut
https://app.programmingfonts.org/#source-code-pro

Meslo

Meslo adalah font yang dibuat untuk perbaikan tampilan dari font Menlo. Font Menlo sendiri adalah font monospace yang ada di sistem operasi MacOS. Berbeda dengan Menlo yang lisensinya dimiliki oleh Apple dan MacOS, lisensi font Meslo bebas digunakan karena bersifat Open Font.

Tampilan dari font Meslo

Font Meslo ini dapat diunduh gratis di
https://github.com/andreberg/Meslo-Font
Sedangkan demo penggunaan font Meslo diakses dari tautan berikut
https://app.programmingfonts.org/#meslo

DejaVu Sans Mono

DejaVu Sans Mono adalah font dibuat dari Vera Fonts. Font ini berada dalam satu paket DeJaVu Font Family yang dibuat untuk standar tampilan font sesuai Unicode pada tahun 2004.

Tampilan font DeJaVu Sans Mono

Font ini dapat diunduh pada tautan berikut ini
https://dejavu-fonts.github.io/
Sedangkan demo tampilannya dapat diakses di tautan berikut
https://app.programmingfonts.org/#dejavu

Monoid

Font Monoid adalah font yang dibuat dari awal khusus untuk tampilan teks kode. Font ini mendukung ligature seperti halnya Fira Code, namun dengan tambahan simbol glyph dari Powerline Font. Kekurangan font ini adalah tidak tersedianya weight Medium dan Bold, hanya ada Regular saja.

Tampilan font Monoid pada kode

Font ini dapat diunduh di tautan berikut
https://larsenwork.com/monoid/
Demo font ini dapat diakses pada tautan berikut
https://app.programmingfonts.org/#monoid

Operator Mono

Operator mono adalah font monospace dengan ligature dan tambahan simbol berbentuk huruf sambung. Font ini bersifat berbayar, sehingga untuk menggunakannya, perlu membeli pada web yang menyediakannya.

Contoh tampilan Operator Mono

Font Operator Mono dapat dibeli di web berikut
https://www.typography.com/fonts/operator/styles

Dank Mono

Sama halnya dengan Operator Mono, Dank Mono adalah font berbayar dengan ligature lebih lengkap. Font ini didesain dari awal sebagai font untuk tampilan teks kode dan programming.

Spesimen Dank Mono
Dank Mono ketika dipakai di dalam text editor

Harga font ini lebih terjangkau jika dibandingkan dengan Operator Mono. Selain itu pengembangnya juga lebih aktif dalam memperbaiki tampilan font ini. Dank Font bisa dibeli di tautan berikut ini.
https://dank.sh/

Pemasangan Font

Font-font tersebut dapat dipasang dengan mudah ke dalam sistem operasi komputer kita. Pada sistem operasi Linux, pemasangan font bisa dilakukan dengan aplikasi Fonts . Atau bisa juga memindahkan font dengan ekstensi .ttf ke folder “~/.local/share/fonts/” yang ada di Home folder. Sedangkan pada sistem operasi MacOS, pemasangan font bisa dilakukan dengan bantuan aplikasi manajemen FontBook bawaan sistem operasinya.

Font Favorit Penulis

Penulis memiliki font favorit yang dipakai untuk text editor dan Terminal-nya. Font yang menjadi favorit penulis adalah font Iosevka, Fira Code, dan Ubuntu Mono. Font Iosevka menjadi favorit karena font ini lebih rapat spacingnya, dan ukurannya sedikit lebih tinggi. Font ini memiliki varian untuk dipasang di Terminal dan mendukung tampilan tema dari framework Terminal Oh My Zsh. Tampilannya seperti yang terlihat di gambar bawah ini.

Font Iosevka yang dipakai pada text editor dan Terminal

Font-font yang disebutkan di atas adalah sekadar referensi dan hasil uji coba pemakaian oleh penulis. Dan kemungkinan referensi antara pengembang yang satu dengan yang lain berbeda-beda dalam memilih font untuk programming. Jika kalian ada referensi lain mengenai font untuk teks programming, silahkan tulis di bagian komentar artikel ini.

Pranala Referensi Font

Beberapa referensi untuk sumber lain seputar font untuk programming dapat dilihat di bawah ini.

--

--

Rian Yulianto W
JavaScript Indonesia Community

Suka pada yang simpel dan berguna. Suka sama penguin dan apel, tapi ga suka sama jendela.