Cara mengetahui kode warna dari CSS pada website

Kadang kita ingin merubah-rubah warna pada template yang kita miliki, tetapi bingung untuk menemukan warna yang pas agar blog tetap terlihat matching dan warna tidak terlalu dominan.

Cara mengetahui kode warna dari CSS pada website

Kendalanya adalah kita tidak bisa menghapal seluruh kode warna atau jika mencari secara manual, kadang warna tersebut masih kurang dari apa yang sebenarnya kita inginkan.

Jika kita terbiasa mengoprek kode CSS atau terbiasa dengan dunia web programming, tentu hal tersebut bukanlah masalah. Tetapi jika kita tidak paham sama sekali, tentu akan menjadi masalah yang cukup merepotkan.

Sebenarnya kita bisa secara langsung mendapatkan kode CSS dari halaman sebuah website, bukan hanya warna saja, tetapi attribut lainnya juga bisa kita dapatkan. Caranya adalah dengan memanfaatkan fasilitas Inspect Element pada Google Chrome.

Caranya adalah sebagai berikut.

  1. Silahkan pilih area pada halaman website yang ingin di ketahui kode warnanya
  2. Klik kanan pada bagian tersebut, bisa di mana saja
  3. Pilih Inspect Element pada pilihan klik kanan
  4. Anda akan mendapatkan kode warna seperti pada contoh berikut ini.
  5. Di sini saya mencoba meng inspect kode warna pada menu header blog Kampus Cloud, kemudian saya pilih Inspect Element pada menu klik kanan
  6. Nah, di bagian Background yang saya beri warna kuning itulah tempat di mana kita bisa mengetahui kode warna CSS tersebut

Cara mengetahui kode warna dari CSS pada website

Jika ingin mengeksplorasi atau mencoba-coba mengubah warna pada template tersebut, pada ICON warna ( Contoh di atas yang berwarna biru ) bisa kita klik dan mengubahnya sesuai dengan warna yang kita inginkan.