Change the font size of Safari's Web Inspector

Does anyone know how to change the font size in Safari's Web Inspector? It's too small for me and my eyes can't stand staring at it during long periods of time.

I've found some links on the web concerning my question but they don't seem to work either:

  1. https://gist.github.com/vlazar/1549785
  2. http://miekd.com/articles/adding-some-monospace-to-the-safari-web-inspector/

I'll switch back to Chrome and use its own Web Inspector if there aren't any solutions available.


Thanks for the answers above. As an update, in Mavericks 10.9, the file is still Main.css and can now be found at the following path:

/System/Library/PrivateFrameworks/WebInspectorUI.framework/Versions/A/Resources

You may also find the file using following terminal command:

find /System/Library/PrivateFrameworks -name Main.css

For Mountain Lion (10.8.x), I found the file name is actually Main.css and on my system it is located in:

/System/Library/PrivateFrameworks/WebInspector.framework/Versions/Current/Resources/

Add the following text to the end of this file and save it. Essentially, this is the same text as in the other answer in this thread, but without the line breaks.

body, #console-messages{font-size:18px;}

You will need to restart your Safari after you make this change, before it will take effect.

Tip: To quickly open the folder where Main.css is located...

  1. Select the path
  2. Right-click on the selected path and then from the popup menu choose: Services -> Open.
  3. This will open the folder for you.

At the end of inspector.css add the font size and style.

The file is located in /System/Library/Frameworks/WebKit.framework/Versions/A/Frameworks/WebCore.framework/Versions/A/Resources/inspector

(for Safari on Windows the file located at: C:\Program Files (x86)\Safari\Apple Application Support\WebKit.resources\inspector\inspector.css )

An example:

body, #console-messages{
font-size:18px;
}