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:


You may also find the file using following terminal command:

find /System/Library/PrivateFrameworks -name Main.css
  • 2
    Rather than thanking for other answers in your answer you may comment or preferably, use your votes and upvote the answer you like. – Deesbek Nov 24 '13 at 3:49

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


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.
  • 1
    Didn't work for me. Is there possibly less hacky way? – Dmitri Zaitsev Dec 22 '13 at 8:08
  • 1
    Not that I know of. Actually, I have switched to Chrome for my web development. In Chrome you can just press Cmd+/- to adjust the console and development environment font size and I no longer have out-of-memory problems, which I did with Safari. – Paul Bastowski Dec 27 '13 at 17:13

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{
  • There is no file inspector.css in that directory :( – Dmitri Zaitsev Dec 22 '13 at 7:59

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .