This is a repository to hold any themes the web community puts together for Devtools.
Switch branches/tags
Nothing to show
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Failed to load latest commit information.

Devtools Themes

“Ever want to change the look of your Google Chrome Web Inspector? I personally love being able to customize the 'theme' or 'brush' of my favorite IDE and my Web Inspector is no different. If you’ve ever done some snooping around Google Chrome’s Web Inspector you may have noticed that it’s made of straight HTML + CSS + JavaScript. My buddy Paul Irish was the one to show me how you can 'inspect' the Inspector (very Inception-esque).

“With this knowledge, I acquired the help of my good friend Wes Bos. Together we went looking for a way to customize our installs. Luckily enough, the Chromium team have set us up with a nice way of inserting our own CSS.”

This is awesome! How do I use this?

Pick any theme and drop it in one of these locations depending on your system:

Mac: ~/Library/Application\ Support/Google/Chrome/Default/User\ StyleSheets/Custom.css

PC: C:\Users\YourUsername\AppData\Local\Google\Chrome\User Data\Default\User StyleSheets\Custom.css

Ubuntu (Chromium): ~/.config/chromium/Default/User\ StyleSheets/Custom.css

Making changes...inspect the inspector!

Detach your devtools from the window with the button on the bottom left. With devtools still focused, open devtools again (⌥⌘I (Command + Option + I) or Control + Shift + I). Customize any styles on the fly then update your Custom.css file.

Tomorrow Night

Get Tomorrow Night