Generator Palet Acak untuk Kombinasi Warna HEX & RGB
Pilih jumlah warna, hasilkan palet baru, dan salin nilai HEX atau RGB langsung dari kartu.
Belum ada palet.
Tekan tombol atau Space untuk mulai.
Riwayat (0/50)
Panduan singkat
- BuatTombol atau Space
- Salin warnaKlik kartu atau tekan Enter
- BagikanWarna tersimpan di URL
- SimpanRiwayat lokal browser
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.
Panduan palet acak
Generator palet acak mengambil jumlah warna yang dipilih lalu mengisi setiap slot dengan nilai RGB acak yang independen. Setiap kartu hasil menampilkan kode HEX siap pakai di web beserta padanan RGB-nya, dan Anda bisa menyalin satu swatch, membagikan seluruh palet lewat URL, atau menelusuri riwayat untuk melihat kombinasi sebelumnya.
Tidak ada koreksi teori warna yang diterapkan. Setiap warna dibuat dengan mengambil nilai acak independen untuk kanal merah, hijau, dan biru, lalu mengonversinya ke notasi HEX dan RGB.
Apa itu palet warna dan mengapa dihasilkan secara acak
Palet warna adalah sekumpulan warna yang dipilih untuk digunakan bersama dalam satu proyek. Sistem desain menetapkan warna utama, sekunder, latar belakang, dan aksen, lalu menerapkannya secara konsisten di setiap layar. Bekerja tanpa palet menghasilkan nada yang tidak seragam dan memakan lebih banyak waktu untuk diselaraskan di kemudian hari.
Pembuatan acak sengaja menghasilkan kombinasi yang tidak bisa ditebak. Memilih hanya berdasarkan aturan roda warna cenderung menjaga hasil di wilayah yang sudah dikenal, sedangkan nilai acak memunculkan warna yang biasanya tidak Anda pertimbangkan. Itu membuat palet acak berguna untuk tahap awal pencarian ide dan eksplorasi suasana saat variasi lebih penting daripada harmoni.
- Palet mengelompokkan warna yang membentuk nada visual proyek
- Kombinasi acak mendorong melampaui pilihan biasa
- Cocok untuk eksplorasi tahap awal dan penemuan suasana
- Penyesuaian kecerahan dan saturasi sebelum keputusan akhir tetap diperlukan
Format HEX: arti #RRGGBB
Kode warna HEX adalah angka heksadesimal enam digit yang didahului tanda #. Dua digit pertama mewakili merah, dua tengah hijau, dan dua terakhir biru, masing-masing berkisar dari 00 hingga FF. Contohnya, #FF0000 berarti merah maksimal sementara hijau dan biru nol, menghasilkan warna merah murni.
Setiap digit heksadesimal memiliki 16 kemungkinan nilai (0–9 dan A–F). Dua digit per kanal menghasilkan 16 × 16 = 256 tingkat. Menggabungkan tiga kanal menghasilkan sekitar 16,77 juta warna berbeda. Notasi yang sama dibaca secara identik oleh CSS, HTML, dan setiap alat desain populer.
- Setiap pasangan digit di #RRGGBB sesuai dengan satu kanal
- 00 berarti kanal mati; FF adalah intensitas penuh
- 256 tingkat per kanal, total sekitar 16,77 juta warna
- Ditafsirkan sama di CSS, HTML, Figma, dan lainnya
Format RGB: Merah, Hijau, Biru 0–255 dan hubungannya dengan HEX
RGB menyatakan masing-masing dari tiga warna primer cahaya—Merah (Red), Hijau (Green), Biru (Blue)—sebagai bilangan bulat desimal dari 0 hingga 255. rgb(255, 0, 0) sama dengan #FF0000, dan rgb(0, 128, 255) sama dengan #0080FF. HEX menulis satu string kontinu, sedangkan RGB memisahkan tiga nilai dengan koma.
Konversinya sederhana: ubah setiap pasangan dua digit HEX menjadi padanan desimalnya. FF menjadi 255, 80 menjadi 128, 00 menjadi 0. Alat ini menampilkan kedua notasi secara berdampingan sehingga Anda tidak perlu menghitung secara manual.
- RGB menyatakan setiap kanal sebagai desimal 0–255
- Ubah dua digit HEX ke desimal untuk mendapat nilai RGB
- FF = 255, 80 = 128, 00 = 0
- Kedua notasi muncul di setiap kartu hasil
Cara menggunakan alat ini langkah demi langkah
Mulai dengan memilih jumlah warna dari dropdown di bagian atas. Nilai bawaan adalah lima; rentangnya tiga sampai lima belas. Klik "Buat Palet" di sebelah dropdown dan kartu swatch sebanyak itu langsung muncul. Pengguna keyboard bisa menekan Space untuk tindakan yang sama.
Setiap kartu menampilkan pratinjau warna, kode HEX, dan nilai RGB-nya. Klik kartu mana pun untuk menyalin kode HEX ke clipboard sistem—notifikasi toast mengonfirmasi penyalinan. Jika hasilnya cocok, gunakan tombol Bagikan atau Salin URL untuk mengirim palet ke orang lain.
- Pilih jumlah warna dari dropdown (3–15, bawaan 5)
- Klik tombol atau tekan Space untuk menghasilkan palet
- Klik kartu untuk menyalin kode HEX ke clipboard
- Bagikan atau Salin URL untuk mengirim palet
Jumlah warna: kapan memilih 3, kapan 15
Palet tiga sampai lima warna cukup ketika Anda butuh warna utama, sekunder, dan aksen dengan cepat. Nada halaman arahan, set ikon, dan tema UI sederhana cocok dalam rentang itu. Lebih sedikit warna lebih mudah dibandingkan sekilas dan membantu mengambil keputusan lebih cepat.
Sepuluh warna atau lebih berfungsi sebagai titik awal untuk dasbor, visualisasi data, atau ilustrasi yang membutuhkan banyak rona berbeda. Imbalannya adalah semakin banyak warna, semakin tinggi kemungkinan nada yang hampir duplikat, sehingga langkah selanjutnya biasanya adalah meninjau dan menyesuaikan kecerahan.
- 3–5 warna: keputusan nada cepat untuk UI dasar
- 6–9 warna: tata letak dan presentasi skala menengah
- 10–15 warna: visualisasi data dan ilustrasi multi-rona
- Lebih banyak warna berarti lebih banyak pengecekan duplikat
Menyalin dan menempel kode warna
Mengklik di mana saja pada kartu menyalin kode HEX swatch tersebut ke clipboard sistem. Pengguna keyboard bisa memfokuskan kartu lalu menekan Enter untuk hasil yang sama. Pesan toast langsung muncul agar Anda tahu warna mana yang disalin.
Tempelkan kode langsung ke properti CSS color atau background, kolom warna Figma, atau dialog warna kustom PowerPoint. Jika Anda butuh nilai RGB, baca dari kartu dan ketik secara langsung—tidak perlu perhitungan konversi.
- Klik atau tekan Enter untuk menyalin HEX
- Notifikasi toast mengonfirmasi penyalinan
- Tempel langsung ke CSS, Figma, atau PowerPoint
- Nilai RGB terlihat di kartu untuk diketik langsung
Berbagi lewat URL: cara warna dikodekan di alamat
Menghasilkan palet otomatis menulis set warna saat ini ke parameter URL. Salin URL itu dan kirim lewat pesan atau email—penerima membuka palet yang sama tanpa login atau state tersimpan di server mana pun. Alamat itu sendiri yang membawa palet.
Tombol Salin URL menaruh alamat saat ini ke clipboard. Tombol Bagikan membuka lembar berbagi sistem di browser yang mendukung Web Share API. Di browser desktop yang tidak mendukung Web Share, tindakan ini beralih ke penyalinan URL.
- Kode warna disimpan di parameter URL
- Satu tautan mereproduksi palet yang persis sama
- Salin URL: alamat masuk ke clipboard
- Tombol Bagikan: membuka lembar berbagi sistem jika tersedia
Riwayat: palet tersimpan di browser
Setiap palet yang dihasilkan disimpan otomatis di localStorage browser. Catatan bertahan setelah memuat ulang halaman dan memulai ulang browser. Hingga 50 entri disimpan; begitu batas tercapai, entri paling lama dihapus secara otomatis.
Klik kartu di bagian riwayat untuk mengembalikan palet itu ke tampilan utama. Tombol Hapus Semua menghapus semua entri sekaligus. Karena localStorage terikat pada browser dan perangkat tertentu, riwayat tidak berpindah ke browser atau mesin lain.
- Disimpan otomatis di localStorage, bertahan setelah muat ulang
- Batas 50 entri; yang paling lama dihapus saat penuh
- Klik kartu riwayat untuk memulihkan palet
- Tidak dibagikan antar browser atau perangkat
Generasi acak versus harmoni warna
Alat ini menghasilkan setiap warna dengan mengambil nilai acak independen untuk R, G, dan B. Alat ini tidak menghitung hubungan komplementer, analog, triadik, atau hubungan roda warna lainnya, sehingga harmoni visual tidak dijamin. Jika Anda butuh skema terkoordinasi, alat berbasis teori warna lebih sesuai.
Di sisi lain, kebebasan dari teori warna bisa menjadi keuntungan. Kombinasi yang sepenuhnya tak terduga kadang mengungkapkan arah yang tidak akan Anda jelajahi sendiri. Mengambil satu atau dua favorit lalu menyesuaikan kecerahan atau saturasinya sering menghasilkan rentang ide yang lebih luas daripada tetap di dalam aturan sejak awal. Pendekatan dua fase—acak untuk eksplorasi, berbasis teori untuk penyempurnaan—adalah alur kerja yang umum.
- Setiap kanal adalah nilai acak independen; tanpa hubungan roda warna
- Gunakan alat berbasis teori untuk palet komplementer atau analog
- Kombinasi tak terduga bisa mengungkap arah baru
- Jelajahi secara acak dulu, sempurnakan dengan teori kemudian
Aksesibilitas warna: rasio kontras dan buta warna
WCAG 2.2 merekomendasikan rasio kontras luminansi minimum 4,5 : 1 untuk teks normal dan 3 : 1 untuk teks besar. Warna yang dipilih secara acak lalu diterapkan langsung sebagai latar dan teks bisa jatuh di bawah ambang tersebut. Selalu jalankan pemeriksa kontras setelah menghasilkan palet yang akan Anda pakai.
Bagi pengguna dengan buta warna, pasangan merah-hijau yang terlihat berbeda bagi kebanyakan orang bisa menjadi tak bisa dibedakan. Menjalankan simulator buta warna sebelum memfinalisasi palet membantu merencanakan desain yang tidak bergantung pada warna saja. Menggabungkan warna dengan ikon, pola, atau label meningkatkan aksesibilitas secara keseluruhan.
- WCAG 2.2: minimum 4,5 : 1 teks normal, 3 : 1 teks besar
- Warna acak bisa menghasilkan kontras yang tidak cukup
- Simulator buta warna direkomendasikan sebelum memfinalisasi
- Gabungkan warna dengan ikon, pola, atau label
Kasus penggunaan: desain web, presentasi, curah ide
Di awal proyek web, ketika belum ada warna merek, memutar palet acak adalah cara cepat menjelajahi suasana. Begitu kombinasi terasa cocok, masukkan kode HEX ke custom property CSS, pratinjau hasilnya, dan sesuaikan sampai palet terkonfirmasi. Ini mempersingkat fase keputusan warna saat prototyping.
Grafik slide presentasi, pemisah bagian, dan aksen infografis semuanya butuh rona yang bisa dibedakan—palet acak menyediakan kandidat dalam hitungan detik. Desainer game menggunakannya untuk bereksperimen dengan palet karakter dan lingkungan, dan ilustrator mengumpulkan swatch mood board darinya. Apa pun medianya, verifikasi kontras dan koherensi sebelum penyerahan akhir.
- Desain web: masukkan kode HEX ke custom property CSS
- Presentasi: pilih warna grafik dan pembatas bagian
- Game dan ilustrasi: eksperimen palet karakter dan latar
- Selalu verifikasi kontras dan koherensi sebelum penyerahan akhir
Pertanyaan yang sering diajukan
QBerapa rentang jumlah warna yang tersedia?
Anda bisa memilih dari 3 sampai 15. Tiga cocok untuk memilih warna inti dengan cepat; lima belas sesuai untuk komposisi banyak rona.
QApa yang disalin saat mengklik kartu?
Kode HEX enam digit dari swatch tersebut (mis. #3A7BFC) diletakkan di clipboard sistem, siap ditempel ke CSS atau alat desain.
QApakah orang lain melihat palet yang sama dari URL yang dibagikan?
Ya. Data warna tertanam di parameter URL, jadi membuka tautan mereproduksi palet yang persis sama.
QApakah riwayat tersinkronisasi lintas perangkat?
Tidak. Riwayat disimpan di localStorage browser sehingga hanya tersedia di browser yang sama pada perangkat yang sama.
QWarna yang dihasilkan tampak tidak cocok satu sama lain.
Alat ini mengambil nilai acak independen tanpa menerapkan harmoni teori warna. Untuk skema komplementer atau analog, gunakan alat berbasis roda warna bersamaan dengan ini.
QApakah alat ini otomatis memeriksa kontras WCAG?
Saat ini belum ada pemeriksaan kontras otomatis. Setelah memilih palet, verifikasi rasio kontras dengan pemeriksa aksesibilitas khusus.
QApa fungsi tombol Space?
Saat fokus keyboard ada di halaman, menekan Space menghasilkan palet baru—berguna untuk menelusuri opsi tanpa menyentuh mouse.
Sumber referensi
Diperiksa 2026-08-19. Definisi dan notasi kode warna mengikuti spesifikasi W3C.