Penjelajah Roda Warna
Pilih warna dasar
Geser sebuah titik pada roda warna dan amati bagaimana penanda harmoni berputar bersamanya, komplementer pada interval 180°, triadik pada interval 120°, tetangga analog, komplementer terbagi, atau tetradik. Berganti antara HSL (roda rekayasa) dan RYB (roda seniman), bandingkan perbedaan keduanya, lalu gunakan kombinasi yang Anda pilih sebagai palet warna.
Cara kerja alat eksplorasi roda warna
-
1
Geser pin di sekitar roda
Pin ini menentukan warna dasar Anda. Kadar saturasi dan tingkat kecerahan dapat diatur melalui kontrol terpisah.
-
2
Pilih harmoni
Komplementer, analog, triadik, komplementer terbagi, tetradik, monokromatik. Penanda harmoni berputar bersama warna dasar.
-
3
Ganti model (HSL vs RYB)
Roda HSL bersifat simetris (warna merah berhadapan dengan warna cyan, warna hijau berhadapan dengan warna magenta). Roda RYB bersifat asimetris (warna merah berhadapan dengan warna hijau, warna biru berhadapan dengan warna oranye), yang sesuai dengan intuisi dalam mencampur cat.
-
4
Salin palet
Hex, RGB, dan HSL untuk nilai dasar serta setiap tanda harmoni; variabel CSS, peta Sass, atau file CSV biasa.
Roda HSL vs Roda RYB
Kedua roda mengatur warna dalam bentuk lingkaran, namun keduanya tidak sepakat mengenai warna mana yang “berlawanan”.
| Basis | Komplemen HSL | Komplemen RYB |
|---|---|---|
| Merah | Sian | Hijau |
| Oranye | Biru kehijauan | Biru |
| Kuning | Biru | Ungu |
| Hijau | Magenta | Merah |
| Biru | Kuning | Oranye |
| Ungu | Kuning-hijau | Kuning |
- HSL (rona, saturasi, kecerahan): representasi silindris sRGB yang digunakan dalam CSS dan desain digital. Menambahkan 180° memilih rona yang berseberangan pada roda digital ini.
- RYB (merah, kuning, biru): roda konseptual tradisional dalam pendidikan seni. Alat ini memetakan ulang sudut rona untuk mendekati kaidah tersebut; hasil pencampuran pigmen nyata tidak dapat diprediksi olehnya.
Keduanya berlaku untuk tujuan yang berbeda. Gunakan HSL untuk karya visual di layar; gunakan RYB jika Anda mengutamakan intuisi dalam penggunaan media lukisan.
Definisi harmoni pada roda
- Komplementer: warna dasar + 180°; pemisahan rona terjauh pada roda yang dipilih.
- Analog: warna dasar dengan tetangga pada -30° dan +30°; lembut dan menyatu.
- Triadik: warna dasar + 120° + 240°; memberikan kesan ceria yang seimbang.
- Komplementer terbagi: warna dasar + 150° + 210°. Kaya nuansa, namun tanpa ketegangan penuh seperti pada skema komplementer.
- Tetradik/persegi: warna dasar + 90° + 180° + 270°; empat rona dengan jarak yang sama.
- Monokromatik: rona yang sama, dengan tingkat kecerahan dan kejenuhan yang berbeda.
Suhu di roda
- Setengah hangat: merah, oranye, kuning. Secara tradisional terasa maju (menarik pandangan ke depan).
- Setengah dingin: hijau, biru, ungu. Secara tradisional terasa mundur (menjauh dari pandangan).
- Netral: warna dengan kejenuhan rendah; termasuk ke salah satu sisi tergantung rona yang menyertainya.
Penggunaan Praktis
- Eksplorasi palet merek: geser pin penanda hingga Anda menemukan warna yang sesuai, lalu periksa tanda triadik atau tetradik untuk mendapatkan aksen pendukung.
- Studi seni: pilih sebuah foto sebagai referensi, tentukan warna dominannya, lalu periksa warna-warna tetangga yang serupa untuk mendapatkan efek bayangan monokromatik.
- Ilustrasi: pilih pasangan warna yang saling melengkapi untuk bayangan; misalnya, untuk objek berwarna oranye, gambarkan bayangannya dengan warna biru, bukan hanya oranye tua.
- Mock-up desain interior: roda triadik sesuai dengan palet warna interior klasik (biru/kuning/merah dalam gaya Amerika tradisional; hijau/oranye/ungu dalam gaya bohemian).
Mengapa roda tidak sepenuhnya intuitif
Persepsi warna manusia yang sebenarnya jauh lebih kompleks daripada yang diindikasikan oleh sistem roda warna mana pun. Sistem Munsell, LAB, dan OKLCH semuanya berupaya menciptakan susunan warna yang seragam secara perseptual, namun tidak membentuk lingkaran sederhana, karena nilai kroma bervariasi tergantung pada tingkat kecerahan pada setiap nuansa. Dalam pekerjaan desain produksi, ruang warna perseptual memberikan hasil yang lebih jernih dibandingkan sistem roda warna; sedangkan dalam eksplorasi konseptual warna, sistem roda warna tetap unggul dalam hal kejelasan.
Pertanyaan yang Sering Diajukan
HSL untuk desain digital (CSS, tampilan layar, antarmuka pengguna). RYB jika Anda merujuk pada cat, pencetakan, atau seni tradisional dan menginginkan intuisi harmoni khas sekolah seni konvensional.
Kedua model menata rona secara berbeda. HSL memakai sudut rona sRGB, sehingga sian berada di seberang merah. Dalam kaidah RYB tradisional, hijau berada di seberang merah. RYB di sini adalah pendekatan visual, bukan prediksi hasil pencampuran cat tertentu.
Untuk keperluan pendidikan, penyusunan sketsa ide, dan komunikasi dengan klien, ya. Adapun untuk pekerjaan palet yang presisi, para profesional semakin sering menggunakan sistem persepsi warna (LAB, OKLCH), di mana tingkat kecerahan dan kroma tidak bergantung pada nada warna.
Salin palet sebagai CSS, Sass, atau CSV lalu simpan di tempat Anda bekerja. Alat ini tidak menyediakan pustaka palet atau penyimpanan akun. Dalam alur empat langkah, pengaturan roda yang terlihat disertakan dalam URL dan dapat tetap ada di riwayat browser.
Alat Terkait
Penghitung FPS
Ukur FPS browser dengan requestAnimationFrame: penghalusan, frame rate minimum dan maksimum, ambang peringatan, dan grafik opsional. Berjalan lokal, tanpa unggahan dan tanpa API.
Konverter Base64 ke Hex
Konversi string Base64 menjadi byte dasarnya yang dinyatakan dalam heksadesimal (hex). Berguna untuk memeriksa token, kunci, sertifikat, dan JWT.
Konverter Biner ke Oktal
Konversi biner ke oktal dengan mengelompokkan bit tiga per tiga. Berguna untuk izin Unix, sistem lama, dan tampilan angka ringkas.
Konverter Biner ke ASCII
Tempel data biner (bita dipisah spasi atau aliran bit panjang) dan dapatkan teks ASCII yang diwakilinya. Mendukung pengodean 7-bit dan 8-bit.
Konverter ASCII ke Biner
Konversi string ASCII apa pun ke representasi binernya. Setiap karakter menjadi delapan bit, dipisahkan spasi, siap ditempel ke jejak protokol atau tugas sekolah.
Generator Warna Acak
Buat 1 hingga 50 warna HEX acak dengan contoh warna yang bisa dipratinjau, disalin, dan dipakai di CSS, pengujian, atau eksplorasi palet.