Palet warna dari gambar: warna dominan dengan kodenya

Cara memakai

Klik Pilih foto atau letakkan gambar di kotak. Foto dibaca di perangkat Anda.
Pilih Jumlah warna, dari 5 sampai 10. Gambar yang ramai memerlukan lebih banyak warna.
Baca setiap warna: kode heksadesimalnya, nilai RGB dan HSL, serta bagiannya dalam gambar. Klik tombol salin di sebelah warna untuk menyalin kode heksadesimalnya.
Di bawah Ekspor palet, gunakan Salin sebagai variabel CSS, Salin sebagai daftar, atau Unduh sampel warna (PNG).

Cara warna ditemukan

Setiap piksel diubah ke CIE L*a*b*, ruang warna tempat jarak antara dua warna mendekati seberapa berbeda keduanya tampak di mata. Piksel lalu dikelompokkan menjadi jumlah warna yang Anda pilih dengan pengelompokan k-means, yang menempatkan pusat setiap kelompok sehingga piksel sedekat mungkin dengan pusatnya.

Pusat awal dipilih dengan metode k-means++, dengan benih tetap, sehingga foto yang sama selalu menghasilkan palet yang sama. Setiap warna adalah rata-rata piksel dalam kelompoknya, dan bagiannya adalah jumlah piksel itu dibagi semua piksel.

Piksel → (L*, a*, b*)
Kelompok: setiap piksel bergabung dengan pusat terdekat; pusat adalah rata-rata piksel-pikselnya
Warna = RGB rata-rata kelompok; bagian = piksel kelompok ÷ semua piksel

Foto dianalisis sebagai salinan hingga sekitar 2 megapiksel, sehingga foto besar tetap cepat diproses.
Warna yang sangat mirip dapat berbagi satu warna. Palet 10 warna dapat memisahkan satu warna menjadi dua ketika foto memiliki banyak nuansa dari warna itu.

Kode, bagian, dan maknanya

Kode heksadesimal adalah warna yang ditulis dalam tiga pasang digit heksadesimal untuk merah, hijau, dan biru; nilai RGB adalah angka yang sama dalam desimal. HSL memberi rona sebagai sudut di roda warna (0 adalah merah, 120 hijau, 240 biru), saturasi sebagai kekuatannya, dan kecerahan sebagai seberapa terang warnanya.

Bagian adalah pecahan piksel gambar yang termasuk dalam suatu warna, yaitu luas yang ditempatinya. Titik kecil yang cerah dapat berupa warna dengan bagian kecil, dan latar belakang besar yang lembut dapat memiliki bagian besar yang terdiri dari beberapa nuansa yang mirip.

Salin variabel CSS untuk memakai warna dalam halaman web atau desain: setiap warna menjadi --color-1, --color-2, dan seterusnya.
Pita PNG cocok untuk papan inspirasi atau cetakan: satu sampel per warna, dengan kode heksadesimalnya di bawah.

Contoh kerja: blok merah, biru, dan hijau

Gambar uji dengan 50 piksel merah, 30 biru, dan 20 hijau menghasilkan tepat tiga warna, karena setiap blok adalah satu warna rata. Ketika diminta enam warna, alat ini tetap mengembalikan ketiga warna itu, tanpa warna yang dikarang.

Daftarnya diurutkan dari bagian terbesar, dan setiap kode adalah warna tepat dari bloknya.

Warna	Heksadesimal	RGB	HSL	Bagian
Merah	#FF0000	rgb(255, 0, 0)	hsl(0, 100%, 50%)	50,0%
Biru	#0000FF	rgb(0, 0, 255)	hsl(240, 100%, 50%)	30,0%
Hijau	#00FF00	rgb(0, 255, 0)	hsl(120, 100%, 50%)	20,0%

Pertanyaan yang sering diajukan

Apakah warnanya tepat sama dengan foto?

Area rata memberi warna tepatnya. Foto dengan gradasi memberi rata-rata tiap kelompok, yang merupakan ringkasan yang adil atas gambar, tetapi bukan setiap nuansa di dalamnya.

Mengapa palet selalu sama setiap kali?

Pengelompokan dimulai dari benih tetap, sehingga foto yang sama dan jumlah warna yang sama selalu menghasilkan palet yang sama. Mengubah foto atau jumlah warna akan mengubah hasilnya.

Berapa banyak warna yang sebaiknya dipilih?

Lima warna menangkap suasana utama sebagian besar foto. Gunakan 8 sampai 10 untuk gambar yang ramai atau ketika Anda memerlukan lebih banyak nuansa untuk lukisan atau desain.

Apakah foto diunggah ke suatu tempat?

Tidak. Foto dibaca oleh peramban Anda, palet dihitung di perangkat Anda, dan tidak ada yang dikirim kepada kami.

Apa perbedaan antara heksadesimal, RGB, dan HSL?

Ketiganya menggambarkan warna yang sama dengan tiga cara: heksadesimal dan RGB mendaftar jumlah merah, hijau, dan biru, dalam heksadesimal dan desimal. HSL menggambarkan rona, saturasi, dan kecerahan, yang lebih mudah disesuaikan dengan mata.

Sumber

Angka dan teks terakhir diperiksa pada Selasa, 10 November 2026.