You'll then need to reload (close and reopen) the subsequent DevTools window after you make changes. I find the fastest way to see changes take affect is to undock DevTools in a separate window and then open a subsequent DevTools window ( cmd + opt + I while the current DevTools window is focused) after changes have been saved and grunt reloads the assets.

Make sure Developer Tools experiments are enabled and custom UI themes are allowed.

(Disable DevTools Author if you have the extension installed from the Chrome Web Store.).

(also enable Allow incognito below if you wish).

Once grunt is running, to install development extension in Chrome, open Settings > More Tools > Extensions and click on the Load unpacked extension.

Installation: $ git clone cd devtools-author The Devtools Author Chrome extension is built using NodeJS and GruntJS. If you would like to contribute additional themes, you can follow the below steps:įork the GitHub repository and then follow the steps below.

Incremental control of font size, from 10px - 22px.

Custom font support via enabled system fonts.

The ability to choose from +25 custom editor themes.

This will provide, out of the box the following features:

Open DevTools (cmd + opt + I) Settings > Experiments > check Allow custom UI themes.

Enable Developer Tools experiments in chrome://flags/#enable-devtools-experiments.

Install DevTools Author Chrome extension from Chrome Web Store.

The extensions also provides developers the ability to create additional custom themes using a simple Sass templating system without writing your own extension. The process of creating a Chrome extension for this purpose can be a bit tedious to skin each component by hand from scratch, so I've created a small plugin which provides a collection of built-in themes and additional editor settings for Chrome Developer Tools. As noted in this stack-overflow answer:, the official recommended method of skinning the Google Chrome Developer tools is by creating an extension to override the default styles which are applied, using the.

How to reset google chrome theme