Chrome Devtools colorschemes
One can change the way Chrome Developer Tools looks by having a custom CSS stylesheet, named
Custom.css. The path for the directory that contains the file:
Mac: "Library/Application Support/Google/Chrome/Default/User StyleSheets/" Linux: "~/.config/chrome/Default/User StyleSheets/" Windows: "C:\Users\**Your username**\AppData\Local\Google\Chrome\User Data\Default\User StyleSheets\"
Method above will not work anymore.
To make Solarized Light Theme work in Crome Canary, follow the instructions on:
For tweaking the theme you can use DevTools itself to inspect Devtools:
- undock DevTools
- then hit Ctrl-Alt-i or Cmd+alt+i on Mac
- now you have yet another undocked DevTools window with all the DevTools markup to inspect the DevTools-window you undocked in step 1 …
Solarized Light is a syntax highlighting colorscheme, made by Ethan Schoonover. It is well balanced, and thoroughly tested, and comes in two varieties: a dark, or a light background.
For this Chrome-DevTools colorscheme the light background-color variety was the starting point. In a few places the dark background give some extra contrast.
- Skin your Chrome Inspector, by Darcy Clarke
- Tips and links by Addy Osmani
- more Themes for Chrome Developer Tools
- Solarized project page
- Solarized on Github