Alat yang berguna, siap dipakai

Kuis Kode Warna

Pilih arah soal, format kode, dan tingkat kesulitan. Jawab satu dari empat pilihan untuk langsung melihat jawaban serta nilai kanal RGB.

01 / KUIS

Bagaimana Anda ingin berlatih?

Arah soal

Format kode

Kesulitan Selisih warna pilihan

10 soal · Tanpa batas waktu · Penjelasan langsung

WARNA / KARTU LATIHANPratinjau
#3469D1HEX menuliskan tiga kanal RGB dalam bilangan heksadesimal.

Kuis ini untuk belajar kode warna CSS, bukan tes atau diagnosis penglihatan warna.

Standar ROBERINAlat yang dibutuhkan,
langsung bisa dipakai.
  • Terlihat sejak awalArea input dan hasil dibuat jelas.
  • Hasil lebih duluAngka utama ditaruh di depan, detail mengikuti seperlunya.
  • Tidak banyak syaratTanpa akun atau data tambahan sebelum memakai alat.
ROBERIN

Cara membaca kode warna dan menjawab kuis

Kuis ini menghubungkan warna pada layar dengan angka HEX dan RGB. Pilih kode dari warna yang terlihat, atau tentukan warna dari kode. Setelah menjawab salah satu dari empat pilihan, Anda dapat melihat jawaban dan nilai kanal merah, hijau, serta biru.

Latihan ini membantu Anda membaca dan mengubah nilai warna saat bekerja dengan desain web. Terdapat 10 soal tanpa batas waktu. Skor bukan tes atau diagnosis penglihatan warna.

Apa yang dipelajari dalam kuis kode warna?

Kuis ini menghubungkan warna pada layar dengan nilai HEX dan RGB dalam CSS. Kode tersebut sering dipakai untuk warna tombol, latar, dan garis tepi situs web. Anda bisa berlatih membaca warna menjadi kode atau membayangkan warna berdasarkan kode.

  • Warna ke kode: perkirakan angka dari warna yang terlihat.
  • Kode ke warna: bayangkan contoh warna dari nilai kodenya.
  • Kedua arah menyediakan empat pilihan dan penjelasan kanal setelah menjawab.

Bagaimana cara menyelesaikan 10 soal?

Pilih arah, format HEX, RGB, atau campuran, serta tingkat kesulitan. Jawab satu dari empat pilihan, baca penjelasannya, lalu lanjutkan ke soal berikutnya. Tidak ada batas waktu. Anda juga dapat memakai tombol angka 1–4.

  • Bila baru mulai, pilih Warna ke kode, HEX, dan Mudah.
  • Setiap soal hanya bisa dijawab sekali; menekan ulang tidak mengubah skor.
  • Setelah selesai, lihat skor, persentase benar, dan soal yang salah.

Bagaimana membaca kode HEX?

HEX enam digit dimulai dengan #, diikuti masing-masing dua digit untuk merah (R), hijau (G), dan biru (B). Setiap pasangan bernilai 00 sampai FF dalam basis 16, setara 0 sampai 255 dalam desimal. #FF6600 berarti merah FF(255), hijau 66(102), dan biru 00(0), yaitu warna jingga.

  • #000000: ketiga kanal 0, sehingga tampak hitam.
  • #FFFFFF: ketiga kanal 255, sehingga tampak putih.
  • #FF0000: hanya kanal merah yang bernilai 255.

Apa beda RGB dan HEX?

RGB menuliskan ketiga kanal yang sama sebagai angka desimal. #FF6600 dan rgb(255, 102, 0) adalah warna sRGB yang sama. Dalam kuis ini, setiap nilai kanal RGB berupa bilangan bulat dari 0 hingga 255. Keduanya dapat dipakai sebagai nilai warna CSS.

  • HEX: cocok untuk kode palet enam digit di berkas desain.
  • RGB: memudahkan perbandingan nilai setiap kanal.
  • Campuran: format dipilih per soal; empat pilihan pada soal yang sama memakai satu format.

Apa yang terlihat setelah menjawab?

Kode jawaban dan nilai tiga kanal RGB akan muncul. Panjang batang membantu membandingkan nilainya: pada rgb(255, 102, 0), merah terbesar dan biru nol. Batang ini menjelaskan angka, bukan menentukan nama atau dampak psikologis suatu warna.

  • Soal HEX juga menampilkan uraian kanal RGB.
  • Pada mode kode ke warna, kode pilihan baru ditampilkan setelah dijawab.
  • Status benar atau salah ditunjukkan melalui teks, bukan warna saja.

Apa perbedaan tiap tingkat kesulitan?

Kesulitan mengatur jarak antara warna yang benar dan pilihan yang salah. Mudah memiliki selisih lebih besar; Sulit menyajikan warna yang berdekatan. Kecerahan layar, pengaturan warna, dan pencahayaan sekitar dapat mengubah tampilannya. Skor bukan penilaian penglihatan warna.

  • Mudah: kenali selisih kanal yang besar.
  • Sedang: bandingkan nilai pada warna yang cukup serupa.
  • Sulit: amati selisih kecil dengan layar yang cukup terang.

Bagaimana skor dan jawaban beruntun dihitung?

Pada Mudah, jawaban benar mendapat 10 poin dan salah 0; pada Sedang +20 dan −5; pada Sulit +30 dan −10. Mulai jawaban benar ketiga berturut-turut, tiap jawaban benar memperoleh tambahan 5 poin. Ini aturan permainan setempat, bukan ukuran kesehatan atau kemampuan sensorik.

  • Pada Sedang, dua benar lalu satu salah menghasilkan 20 + 20 − 5 = 35 poin.
  • Pada Mudah, tiga benar beruntun menghasilkan 10 + 10 + 15 = 35 poin.
  • Persentase benar = jumlah benar ÷ 10 × 100; tujuh benar berarti 70%.

Bagaimana meninjau soal yang salah?

Layar hasil menampilkan warna, kode yang benar, dan pilihan Anda untuk soal yang salah pada permainan ini. Anda dapat bermain lagi dengan pengaturan sama atau membalik arah soal. Pecah HEX menjadi tiga pasangan angka untuk menghubungkannya dengan kanal RGB, alih-alih hanya menghafal jawaban.

  • Jika salah saat menebak kode, cari pasangan kanal yang keliru dibaca.
  • Jika salah saat mencari warna, tentukan dahulu kanal yang nilainya paling besar.
  • Jika semua jawaban benar, daftar tinjauan menampilkan pesan tersebut.

Bisakah kode yang sama terlihat berbeda di layar lain?

Ya. Kecerahan layar, pengelolaan warna, mode malam, dan cahaya sekitar dapat mengubah tampilan nilai sRGB yang sama. Pengaruhnya terasa saat membandingkan warna berdekatan pada mode Sulit. Jawaban ditentukan oleh kodenya, bukan penilaian umum tentang apa yang dilihat seseorang.

  • Jika sulit membedakan warna, pilih Mudah dan periksa angka kanal.
  • Status jawaban juga dijelaskan dengan teks.
  • Jangan gunakan kuis ini sebagai pengganti pemeriksaan penglihatan warna.

Kapan kode ini berguna untuk situs web?

Properti CSS seperti color, background-color, dan border-color menerima nilai warna. Mengenali #3469D1 di berkas desain membantu Anda mencarinya di kode dan menentukan kanal mana yang perlu diubah. Keterbacaan teks tetap membutuhkan pemeriksaan kontras tersendiri.

  • Gunakan pemilih warna untuk mengambil warna layar dengan tepat.
  • Gunakan konverter untuk mengubah HEX dan RGB.
  • Periksa kontras antara teks dan latar secara terpisah.

Pertanyaan umum tentang kuis kode warna

Apakah Kuis Kode Warna gratis?

Ya. Anda dapat menjawab 10 soal tanpa mendaftar dan bebas mengganti arah, format HEX/RGB, serta tingkat kesulitan.

Dari mana saya mulai jika baru mengenal HEX?

Pilih Warna ke kode pada tingkat Mudah. Pecah #FF6600 setelah # menjadi tiga pasangan: merah FF, hijau 66, dan biru 00.

Berapa nilai RGB untuk #FF6600?

Nilainya rgb(255, 102, 0). FF berarti 255, 66 berarti 102, dan 00 berarti 0; kedua notasi menunjukkan warna sRGB yang sama.

Berapa rentang nilai kanal RGB?

Setiap kanal merah, hijau, dan biru dalam kuis ini berupa bilangan bulat 0–255. Nol berarti kanal itu tidak ada, sedangkan 255 adalah nilai tertinggi.

Apakah mode Campuran mencampur HEX dan RGB dalam satu soal?

Tidak. Setiap soal memakai HEX atau RGB, dan keempat pilihannya memakai format yang sama agar Anda bisa fokus membandingkan warna.

Bisakah jawaban diubah setelah dipilih?

Tidak. Setiap soal hanya menerima satu jawaban. Baca kode dan kanal RGB yang benar sebelum lanjut; soal salah dapat ditinjau di layar hasil.

Bagaimana persentase benar dihitung?

Bagi jumlah jawaban benar dengan 10, lalu kalikan 100. Jika benar tujuh soal, hasilnya 70%. Perhitungan ini berbeda dari skor berdasarkan kesulitan.

Apakah skor rendah berarti gangguan penglihatan warna?

Tidak. Kuis ini untuk latihan kode warna CSS, bukan tes atau diagnosis. Warna yang mirip juga dapat terlihat berbeda menurut layar dan pencahayaan.

Bisakah kuis dimainkan di ponsel?

Ya. Di ponsel, empat pilihan berada di bawah kartu soal. Dalam mode kode ke warna, pilih contoh warna lalu lihat kode yang ditampilkan.

Di mana catatan kuis sebelumnya disimpan?

Jumlah permainan selesai, jawaban benar, skor tertinggi, dan rekor beruntun hanya disimpan di browser ini; hapus melalui Hapus catatan. Daftar soal salah pada permainan ini hilang setelah halaman dimuat ulang.

Rujukan notasi warna dan aksesibilitas

Rujukan berikut menjelaskan notasi HEX dan RGB serta alasan warna tidak boleh menjadi satu-satunya petunjuk informasi. Diakses: 2026-09-24.

W3C · CSS Color Module Level 4MDN · CSS color valuesW3C · Penggunaan warna

Memakai nilai warna dalam proyek

Gunakan alat ini untuk memilih atau mengonversi format warna yang dipelajari dalam kuis.

Pilih warna di layarKonversi HEX dan RGBBandingkan format warna lain
byROBERIN
Roberin
Developer yang berpengalaman
Saya Roberin, developer berpengalaman yang menciptakan dunia yang lebih baik melalui tools kreatif dan praktis. Teknologi adalah untuk semua orang - mari bersama-sama membangun dunia yang lebih nyaman! 😊
Formulir kontak
Kirim hanya detail yang perlu kami periksa.
Jika perlu balasan, sertakan alamat email. Untuk laporan kesalahan, tuliskan URL halaman, nilai yang dimasukkan, hasil yang diharapkan, dan hasil yang muncul.