Merancang tema terang dan gelap dengan sengaja
Tema gelap bukan tema terang yang dibalik. Catatan tentang memilih dua palet, memeriksa kontras, dan menjaga tampilan pertama tetap pada warna yang benar.
Di halaman ini
Membalik palet terang menghasilkan tema gelap yang secara teknis gelap tetapi secara visual bising: teks putih murni menyilaukan, aksen jenuh bergetar, dan bayangan menghilang. Setiap tema perlu keputusannya sendiri.
Mulai dari permukaan baca
Untuk sebuah jurnal, permukaan utamanya adalah teks panjang. Tema terang memakai warna kertas yang sejuk dengan tinta biru tua alih-alih hitam; tema gelap memakai langit malam biru tua dengan tinta yang dilembutkan. Keduanya menjaga teks isi jauh di atas kontras minimum 4,5:1, termasuk teks sekunder.
- Tentukan pasangan kertas dan tinta untuk teks isi lebih dulu.
- Turunkan teks sekunder dan garis dari pasangan itu, lalu ukur.
- Pilih satu aksen per tema dan setel terpisah: teal yang terbaca di atas kertas terlalu gelap di langit malam.
| Token | Terang | Gelap |
|---|---|---|
| Kertas | #f1f4f7 | #0b1322 |
| Tinta | #14213a | #e6ecf3 |
| Sekunder | #4a5870 | #a6b3c5 |
| Aksen | #0b6e69 | #9ad9d4 |
Tanpa kilatan di tampilan pertama
Preferensi yang tersimpan hanya berguna jika diterapkan sebelum apa pun digambar. Skrip kecil di head dokumen membaca pilihan tersimpan dan memasang data-theme pada elemen root sebelum stylesheet menggambar halaman. Tanpa pilihan tersimpan, skrip mengikuti perangkat sekali, tanpa menawarkan opsi ketiga bernama System.
Dua tema yang disengaja lebih mudah dijaga aksesibilitasnya daripada satu tema dan satu tambahan belakangan.