Chrome Developer Tools
Sebagai pengguna Google Chrome yang sukanya mengutak-atik tampilan web, Chrome Developer Tools adalah fitur dari Google Chrome (dan Chromium) yang paling sering saya gunakan.

Secara default tampilan dari Chrome Developer Tools berlatar belakang putih, namun dengan sedikit trik Anda bisa mengubah tampilan Chrome Developer Tools yang awalnya biasa saja menjadi lebih keren.

Google Chrome

Default

Google Chrome

Dengan Tomorrow Theme

Sebenarnya trik mengubah tampilan dari Chrome Developer Tools ini adalah dengan menambahkan kode-kode CSS pada file Custom.css sesuai dengan keinginan Anda. Dengan mengubah file ini Anda bisa mengubah tampilan halaman web sesuai dengan rules yang Anda buat sendiri pada Custom.css, contohnya pada halaman Facebook yang pernah saya buat.

Ada beberapa tema custom yang bisa Anda terapkan pada Chrome Developer Tools, beberapa diantaranya adalah:

Karena ingin menyamakan tampilannya dengan aplikasi text editor pada Ubuntu saya (Gedit), jadi yang saya gunakan adalah Tomorrow Theme.

Untuk menerapkan tema di atas caranya mudah.

  1. Buka file Custom.css pada komputer Anda dengan aplikasi text editor favorit Anda. Secara dafault isinya kosong. Lokasi Custom.css ini berbeda-beda tergantung sistem operasi yang Anda gunakan:
    • Mac:
      ~/Library/Application Support/Google/Chrome/Default/User StyleSheets/Custom.css
    • Windows:
      C:Users/YourUsername/AppData/Local/Google/Chrome/User Data/Default/User StyleSheets/Custom.css
    • Ubuntu (Chromium):
      ~/.config/chromium/Default/User StyleSheets/Custom.css
    • Ubuntu (Google Chrome):
      ~/.config/google-chrome/Default/User StyleSheets/Custom.css
  2. Buka salah satu link tema, misalnya Tomorrow Theme.
  3. Kemudian copy semua kode-kode CSS pada halaman tersebut mulai dari atas sampai bawah, kemudian paste ke Custom.css yang sedang terbuka.

Setelah itu Anda bisa mencoba menggunakan Chrome Developer Tools, tampilannya kini tidak membosankan lagi.

Sumber:
[Chrome Story]