Cara Mengambil Warna dari Gambar: HEX, RGB dan HSL

Untuk mendapatkan warna yang tepat dari gambar, baca nilai satu piksel, bukan menebaknya dengan mata. Buka gambarnya di pemilih warna, arahkan kursor ke titik yang diinginkan, klik, lalu salin kode HEX-nya. Hasilnya adalah nilai tersimpan dari piksel tersebut, jadi tetap sama setiap kali Anda memilih titik yang sama pada file yang sama.

Pemilih warna gambarButuh kode warna yang tepatPakai gratis

Apa yang disimpan sebuah piksel

Setiap piksel adalah kotak kecil berisi warna. Di layar atau dalam file gambar, piksel disimpan sebagai tiga angka untuk merah, hijau dan biru, masing-masing dari 0 sampai 255. Merah murni adalah 255, 0, 0. Ketiga angka ini membawa informasi yang sama di setiap format, sehingga satu warna bisa ditulis dengan beberapa cara.

HEX, RGB dan HSL

• HEX menulis setiap angka dalam heksadesimal, dua karakter per kanal. #FF0000 adalah merah murni. Halaman web, CSS dan sebagian besar alat desain menggunakan format ini.
• RGB menulis angka yang sama dalam desimal, seperti rgb(255, 0, 0). Warnanya sama dengan kode HEX.
• HSL menggambarkan warna seperti cara orang membicarakannya. Hue adalah sudut pada roda warna, saturasi adalah seberapa kuat warnanya, dan lightness adalah seberapa terang atau gelap warnanya. hsl(0, 100%, 50%) adalah merah murni.

Gunakan HEX saat menempelkan warna ke dalam kode, RGB saat sebuah alat memintanya, dan HSL saat Anda ingin versi warna yang sama dengan nada lebih terang atau gelap. Mengubah lightness di HSL saja mempertahankan hue, yang lebih sulit dilakukan secara manual dengan HEX. Untuk pemeriksaan kontras antara dua warna, lihat HEX, RGB, HSL, CMYK dan kontras.

Berikut contoh warna yang dipakai dalam stylesheet:

.badge {
  background: #1F7A5C;
  color: #FFFFFF;
}

Mengapa kode warna bisa tidak sesuai dengan layar

• Gambarnya dikompresi. JPEG menghemat ruang dengan menghaluskan detail halus, jadi piksel di dekat tepi bisa sedikit berbeda dari warna yang Anda lihat di tengah area.
• Tepi saling bercampur. Di tempat dua warna bertemu, piksel di antaranya adalah campuran. Piksel tersebut bukan warna tersendiri.
• Profil warna berbeda. Pemilih membaca nilai yang diterjemahkan browser, yaitu dalam sRGB. Foto yang disimpan dengan profil gamut lebar bisa tampak berbeda di program lain.
• Penskalaan mencampur piksel. Tangkapan layar yang diambil pada ukuran tampilan yang diskalakan bisa memiliki piksel yang tercampur. Ambil tangkapan layar pada ukuran penuh jika memungkinkan.
• Gambar sangat besar dibaca dari salinan. Gambar dengan sisi terpanjang lebih dari 6000 piksel dibaca dari salinan 6000 piksel, sehingga satu piksel bisa sedikit berbeda dari file ukuran penuh.

Pilih dari tengah area yang rata

Cari area dengan satu warna, lalu pindah ke bagian tengahnya. Lup menampilkan 11 x 11 piksel di sekitar kursor, sehingga Anda bisa melihat apakah titik itu tercampur atau rata. Dengan keyboard, pindahkan bidik satu piksel per waktu dengan tombol panah, atau sepuluh piksel sekaligus dengan Shift, lalu tekan Enter untuk memilih. Periksa tampilan nilainya sebelum disalin.

Gunakan palet untuk skema warna

Sebuah foto jarang hanya memiliki satu warna yang penting bagi Anda. Palet menampilkan hingga enam warna utamanya. Caranya, setiap piksel dibulatkan ke 16 tingkat per kanal, kelompok-kelompoknya dihitung, lalu kelompok yang paling sering muncul dan berbeda satu sama lain dipertahankan. Setiap contoh warna menampilkan rata-rata dari kelompoknya. Ketuk sebuah contoh warna untuk menyalin kode HEX-nya. Anggap palet sebagai titik awal, karena itu adalah rata-rata dan bukan warna merek yang terukur.

Mengonversi antar format

Jika alat desain meminta format yang berbeda, tempelkan kode HEX ke konverter warna. Konverter ini mengubah antara HEX, RGB dan HSL tanpa mengubah warnanya, sehingga hasilnya cocok dengan kode yang sudah Anda pilih.

Pilihan terbaru dan privasi

Alat ini menyimpan pilihan terakhir Anda di halaman agar bisa dibandingkan. Data itu hanya ada di memori tab ini dan akan hilang saat Anda menutupnya. Gambarnya sendiri dibaca di dalam browser Anda dan tidak pernah dikirim ke server.

Cara melakukannya dengan fixmint

1. Buka pemilih warna gambar dan letakkan fotonya di area yang tersedia.
2. Arahkan kursor ke titik yang diinginkan. Atau fokuskan gambar lalu gunakan tombol panah untuk memindahkan bidik satu piksel per waktu, dengan menahan Shift untuk sepuluh piksel.
3. Klik, atau tekan Enter, untuk memilih warna. Periksa tampilan nilainya sebelum disalin.
4. Gunakan tombol Salin di samping HEX, RGB atau HSL untuk menyalin nilai yang Anda butuhkan.
5. Jika alat desain meminta format lain, tempelkan nilainya ke konverter warna.

Jawaban singkat

Mengapa warnanya tampak berbeda di layar saya? Layar Anda menampilkan versi file yang sudah dikelola warnanya dan diskalakan. Pilih dari tengah area yang rata, lalu bandingkan kode HEX dengan contoh warna yang sudah Anda ketahui.

Format mana yang sebaiknya saya salin? HEX untuk halaman web dan sebagian besar alat desain. Gunakan RGB atau HSL jika alat memintanya.

Apakah alat ini mengunggah gambar saya? Tidak. Gambar didekode dan dibaca di dalam browser Anda.