ZeroDarkMatrix Theme for Chrome

A highly customized dark theme for Google Chrome.

Stable and Canary channels are officially supported. Beta and Dev channels will work, but I'm not testing on them.

Detailed commit messages for this theme are now on zero base themes.

Installation

• Add Zero Dark Matrix from the Chrome Web Store.
• Open chrome://flags ▶ Enable Developer Tools experiments and click "Relaunch Now" at the bottom.
• Open developer tools settings ▶ Experiments ▶ [✔] Allow custom UI themes.

Older Chrome versions (v32 and lower)

There are two installation methods:

Rakefile

Requires you to have Ruby and Rake installed. Clone this repo and run rake.

This will install the theme on all profiles. It will backup any existing one to Custom-backup.css prior to overwriting.

Copy/Paste

Pick from the snippets below.

Mac

curl -o ~/Library/Application\ Support/Google/Chrome/Default/User\ StyleSheets/Custom.css https://raw.github.com/mauricecruz/chrome-devtools-zerodarkmatrix-theme/master/Custom.css

PC (Windows Vista / 7 / 8)

powershell -Command "& {(new-object System.Net.WebClient).DownloadFile(""https://raw.github.com/mauricecruz/chrome-devtools-zerodarkmatrix-theme/master/Custom.css""","""$env:APPDATA\..\Local\Google\Chrome\User Data\Default\User StyleSheets\Custom.css""")}"

PC (Windows XP)

powershell -Command "& {(new-object System.Net.WebClient).DownloadFile(""https://raw.github.com/mauricecruz/chrome-devtools-zerodarkmatrix-theme/master/Custom.css""","""$env:APPDATA\Google\Chrome\User Data\Default\User StyleSheets\Custom.css""")}"

Fedora:

curl -o ~/.config/google-chrome/Default/User\ StyleSheets/Custom.css https://raw.github.com/mauricecruz/chrome-devtools-zerodarkmatrix-theme/master/Custom.css

Preview

Elements

Resources

Timeline

Network

Sources

CSS Highlighting

JS Highlighting

Console

Features

• Majority of inspector chrome re-styled
• Customized Scrollbars
• Animations for ** finding elements ** setting elements inactive ** elements/sources/network panels
• Subtle pulsating element selection
• Re-styled Popovers (PSD files included)
• Child element styling in elements panel

Credits

• Thanks to Simon Owen for the base styles. I used his So-Dark-Monokai-v3 as a starting point.
• CSS Tricks for the tutorial on customized scrollbars.
• Animate.css for some of the animations.

Simon's version also used samples from other templates so I will thank them as well!

• IR_Dark_Monokai - Designed and developed by Andres Pagella (@mapagella)
• Todd Werth's IR_Black
• toolbar code from Harris Novick
• Inspired by Darcy Clarke's blog post
• Automatic rake file Rodolfo Puig