Catatan tentang Dark Mode yang Tidak Memanjakan Mata

Banyak situs dark mode yang justru melelahkan mata. Sebagian besar karena mereka pakai hitam pekat (#000000) sebagai background. Ternyata, mata manusia tidak nyaman membaca teks terang di atas hitam pekat dalam waktu lama. Kontras tinggi menyebabkan halation — sejenis "bercak" di sekitar huruf yang membuat mata lelah.

Referensi yang baik: GitHub dark#

GitHub dark memakai #0d1117 sebagai background — bukan hitam pekat tapi biru-hitam sangat gelap. Tekstur warna ini cukup nyaman dibaca berjam-jam. Untuk teks, mereka pakai #c9d1d9 — bukan putih murni. Perbedaan kecil ini signifikan untuk kenyamanan jangka panjang.

Situs ini mengikuti palet yang sama. Background tidak persis hitam, foreground tidak persis putih. Border tipis memisahkan elemen tanpa berat. Semua aksen netral grayscale — tidak ada biru link yang menyala.

Aturan praktis#

Saat memilih warna untuk situs bacaan:

1. Hindari #000 untuk background — pakai nilai oklch sekitar 0.18-0.20
2. Hindari #fff untuk teks utama — pakai sekitar 0.85-0.90
3. Kontras link bukan warna, melainkan underline — paling timeless
4. Border tipis lebih baik daripada shadow — hemat perhatian
5. Satu warna aksen saja (atau nol) — paling sustainable

Mengapa bukan indigo atau biru?#

Banyak design system modern pakai indigo (oklch(0.5 0.2 270)) sebagai warna aksen. Indigo terlihat modern, tapi:

• Sudah menjadi klichen. Hampir semua SaaS modern pakai indigo.
• Cepat terasa ketinggalan zaman. Warna aksen itu bagian dari identitas merek; pilih yang timeless, bukan tren sesaat.
• Mengurangi waktu baca. Kontras warna yang terlalu ramai bikin pembaca terganggu.

Untuk situs ini, semua link memakai warna teks dengan underline. Hover memperkuat underline. Sederhana, konsisten, tidak akan pernah terasa ketinggalan zaman.

Penutup: tipografi sebagai fondasi#

Tipografi lebih penting daripada warna. Sans-serif untuk UI, serif untuk badan artikel (kalau ada), monospace untuk kode — ini sudah jadi standar yang dicoba dan terbukti. Saya memilih system font stack tanpa bergantung pada Google Fonts atau web font apapun. Alasannya sederhana: font system tidak akan pernah gagal dimuat. Halaman tetap terbaca meski CDN font down.

Untuk tulisan terkait soal tipografi, lihat /jurnal/hari-pertama-server-baru.