Bayangkan Anda menelusuri gambar dan Anda menemukan warna yang sempurna – warna yang tepat yang Anda butuhkan untuk proyek desain Anda berikutnya. Ada beberapa alat luar biasa di internet untuk membantu Anda mengidentifikasi warna tertentu pada aplikasi atau situs web apa pun. Mari kita lihat beberapa opsi terbaik mereka.
1. Menggunakan Alat Pengembang di Browser Web Chrome
Salah satu opsi yang dapat Anda coba adalah alat Pengembang Chrome. Chrome hadir dengan banyak fitur bermanfaat untuk pengembang, membuat tugas lebih mudah dilakukan. Anda dapat menggunakan langkah-langkah berikut untuk mengidentifikasi warna tertentu pada aplikasi atau situs web apa pun.
- Buka situs web tempat Anda ingin mengidentifikasi warna di browser web Chrome
- Klik ikon tiga titik di kanan atas Chrome. Sebuah pop up dengan banyak pilihan akan muncul.
- Klik 'Alat Lainnya' dan kemudian pilih 'Alat pengembang' dari pop up yang dihasilkan.
- Gunakan Ctrl + Shift + I jika Anda ingin melewati langkah-langkah di atas
- Sekarang, jendela terbagi menjadi dua layar – situs web di sebelah kiri dan kode situs web di sebelah kanan
- Ketik Ctrl + Shift + C pada keyboard Anda. Ini menunjukkan kepada Anda semua detail elemen tertentu di situs web saat kami mengarahkan kursor mouse ke elemen tersebut.
- Anda dapat menemukan kode warna elemen bersama dengan informasi berguna lainnya.
Contoh
Katakanlah Anda tertarik dengan kode warna tertentu untuk beberapa elemen di situs web berikut:
Anda dapat memilih alat pengembang dengan mengklik tiga titik di sudut layar Anda. Di menu tarik-turun, pilih Alat lainnya, lalu Alat pengembang.
Layar secara visual akan dibagi menjadi dua halaman. Anda akan melihat situs web di sebelah kiri dan kode situs di sebelah kanan.
Ketik perintah dan pintasan "Ctrl + Shift + C" dan arahkan kursor mouse ke elemen situs web. Ini akan menunjukkan warna elemen itu, bersama dengan informasi berguna lainnya. Di bawah ini adalah dua contoh di mana kami menemukan warna bilah navigasi dan dasbor di bawah alat pencarian.
Di sini, kita dapat menemukan kode warna pada pop up untuk bilah navigasi. Kode warna adalah #333333.
Warna dasbor dapat ditemukan bersama dengan detail berguna lainnya. Warna: #333333, Warna latar belakang: #5D4A8E. Meskipun mungkin terlihat sedikit menakutkan pada awalnya, program ini menjadi lebih mudah digunakan dengan sedikit latihan.
2. Ekstensi Chrome Penetes Mata
Eye Dropper adalah ekstensi Chrome yang populer dan banyak digunakan untuk membantu Anda menemukan warna tertentu di situs web atau aplikasi apa pun.
Ikuti langkah-langkah di bawah ini untuk mengidentifikasi warna tertentu pada situs web atau aplikasi menggunakan alat ekstensi Penetes Mata.
- Buka situs web atau aplikasi apa pun di Browser Web Chrome
- Klik pada ikon ekstensi Eye Dropper
- Pilih 'Pilih warna dari halaman web' dan arahkan kursor mouse Anda ke berbagai elemen di aplikasi atau situs web.
Anda dapat menemukan kode warna elemen yang tercantum di kanan bawah halaman web.
Contoh
Oke, mari kita gunakan alat ekstensi pipet dalam contoh kehidupan nyata. Kami akan mulai dengan membuka situs web dan menekan ikon ekstensi Eye Dropper
Saat Anda mengarahkan kursor ke berbagai elemen situs web, Anda dapat melihat kode warna muncul di bagian kanan bawah layar.
Saat saya mengarahkan kursor ke ikon berbentuk V, saya dapat melihat kode warnanya di jendela bawah seperti yang disebutkan. Keuntungan dari alat ini adalah Anda juga dapat menemukan kode RGB bersama dengan kode warna hex dari elemen tersebut. Metode ini fleksibel digunakan bagi mereka yang menginginkan cara sederhana dan cepat untuk mengambil kode untuk warna favorit mereka.