s10wen / SO-Dark-Monokai-v3

Chrome Developer Tools Custom Theme

---

PLEASE NOTE

As of v.33.0.1706.0, Chrome Canary no longer supports custom stylesheets in the User Stylesheets directory.

@darcyclarke filed an issue to restore this functionality. Feel free to voice your opinions there.

In the interim, @mauricecruz has a solution injecting styles through the inspector's inspector.

---

Zero Base Themes

I've started moving this theme across to:

https://github.com/mauricecruz/zero-base-themes

https://github.com/mauricecruz/zero-base-themes/blob/master/themes/s10wen-monokai.less

---

SO-Dark-Monokai-v3

A third version of the theme I tweaked, changing the toolbar icons to text and fixing an issue with the latest release of Chrome Canary.

https://github.com/simonowendesign/SO-Dark-Monokai-v3

Installation:

Automatic

Run rake to copy the files to the correct locations.

Manual

1. Find your Chrome's user stylesheets directory:

   Mac - Finder > shift + cmd + g:

   ~/Library/Application Support/Google/Chrome/Default/User StyleSheets/

   Mac - Terminal:

   ~/Library/Application\ Support/Google/Chrome/Default/User\ StyleSheets/

   Windows:

   C:\Users\**Your Username**\AppData\Local\Google\Chrome\User Data\Default\User StyleSheets\

   Ubuntu (Chromium):

   ~/.config/chromium/Default/User StyleSheets/

2. Replace the existing "Custom.css" file with this one

3. No restart needed, changes are applied immediately

Preview:

Full size preview

Credits

IR_Dark_Monokai Designed and developed by Andres Pagella: http://www.andrespagella.com/customising-chrome-devtools

James Doyle: https://github.com/james2doyle/SO-Dark-Monokai-v3/commits/master

Ben Truyman, Todd Werth: http://blog.toddwerth.com/entries/2

Toolbar code by Harris Novick: https://gist.github.com/4316646

Inspired by Darcy Clarke's blog post: http://darcyclarke.me/design/skin-your-chrome-inspector/

Dock-To-Right when using vertical splitting: https://github.com/mauricelam/DockToRight

Automatic rake file by Rodolfo Puig: #21