Increase font size chrome console

Google ChromeConsole

Google Chrome Problem Overview


How can i increase the font-size in the chrome console?

It seems Paul Irish did it:

enter image description here

http://www.youtube.com/watch?v=4mf_yNLlgic

>UPDATE > > Here are some tips on how customize the theme: > https://plus.google.com/115133653231679625609/posts/UZF34wPJXsL > enter image description here

Google Chrome Solutions


Solution 1 - Google Chrome

If you just need a quick, temporary size bump you can press Ctrl + / - to zoom and Ctrl 0 to reset.

Solution 2 - Google Chrome

Here's a pretty recent blog post on the subject.

Basically, override Default/User StyleSheets/Custom.css in your user directory with something like:

/* Keep .platform-mac to make the rule more specific than the general one above. */
body.platform-mac.platform-mac-snowleopard .monospace,
body.platform-mac.platform-mac-snowleopard .source-code {
    font-size: 11px !important;
    font-family: Menlo, monospace;
}

body.platform-windows .monospace, body.platform-windows .source-code {
    font-size: 12px !important;
    font-family: Consolas, Lucida Console, monospace;
}

body.platform-linux .monospace, body.platform-linux .source-code {
    font-size: 11px !important;
    font-family: dejavu sans mono, monospace;
}

Solution 3 - Google Chrome

  1. Open Browser
  2. Open Console.
  3. Press Ctrl+.

I hope it will help you

Solution 4 - Google Chrome

If you are on a Mac, are using a japanese keyboard, and want to zoom the console temporarily, the short-cuts are:

Zoom In: ^

Zoom Out: -

Reset Zoom: 0

Other Applications are using + for zooming in, but because on japanese keyboards the plus-sign is on the second level, it is only accessible with shift. So: +

That where it gets weird, because to Chrome + apparently means "Zoom Content". If you are in the Javascript console, and do +, the window's content area in zoomed in. But doing a Zoom-out - moves the focus back to the console and zooms it out. Result: The content is getting larger, the console smaller. Aaarggghhh.

Solution 5 - Google Chrome

Windows 7, Google Chrome 19.0.1084.46 m

Method with modifying "User StyleSheets/Custom.css" not worked on me, but Ctrl+"+" worked :-)

Solution 6 - Google Chrome

THIS IS OBSOLETE - See @TinyJaguar's answer. You can now just use Command-+ if you've selected something in the developer console.

If you want to increase the font size in the Javascript console, you need some specific font sizes. It's a bit trickier than just setting the font size for source:

.source-code {
    font-size: 16px !important;
    font-family: monospace;
}

.console-prompt {
    font-size: 16px !important;
    font-family: monospace;
}

.console-message-text {
    font-size: 16px !important;
    font-family: monospace;
}

.monospace {
    font-size: 16px !important;
    font-family: monospace;
}

#elements-content {
  font-size: 16px !important;
}

Solution 7 - Google Chrome

Of Note: From within DevTools, you must have the Elements Tab open in order to adjust font size by using "Ctrl +/-." For some reason it cannot be done in other tabs.

In the newer version of Chrome, you can easily change the font size of font in Developer Tools.

  1. Open Developer Tools
  2. Click on any line in source code Clicking random line on source code
  3. Press Ctrl + + to increase font size or Ctrl + - to decrease font size Pressing required key combinations to increase or decrease font size

Solution 8 - Google Chrome

I've created a small plugin which provides a collection editor settings for Chrome Developer Tools, including the ability to incrementally control font size.

  1. Install DevTools Author Chrome extension from Chrome Web Store
  2. Enable Developer Tools experiments in chrome://flags/#enable-devtools-experiments. Restart Chrome for flags to take effect.
  3. Open DevTools (cmd + opt + I); Settings > Experiments > check Allow custom UI themes.

This will add an 'Author Settings' panel to Chrome Developer Tools, where you can incrementally control font size, from 10px - 22px

Solution 9 - Google Chrome

If you're like me, CMD++ is not working for you because it switches you to the first tab instead (even though you have Enable ⌘ + 1-9 shortcut to switch panels turned off).

Well, in that case, open Dev Tools, Undock into separate window and then go for View --> Zoom in in Chrome Menu Bar. Voilà!

Once you dock Dev Tools back into the browser window, View --> Zoom in will actually increase font size in a browser window, but as long as Dev Tools are undocked, it targets the undocked Dev Tools.

Solution 10 - Google Chrome

I know this is way old, but the simple solution I found is to increase the min. font size in the settings and that will take care of the font size in chrome debugger.

Solution 11 - Google Chrome

Another quick way to change the font size in Chrome Dev tools permanently: Settings--> Show Advanced Settings --> Web Content : change the Page Zoom percentage.

Change font size

Here is the result: http://i.imgur.com/Puzduo9.png Size by size comparison

Solution 12 - Google Chrome

On MacOs, if your key 0 or + or - are on the second level, typing + won't work. In such a case, you need to use capslock , and then you can type + and 0

Solution 13 - Google Chrome

If you're using a newer MacBook pro 2017, you can simply use command => shift => + or - all pressed at once.

Solution 14 - Google Chrome

If you are using a laptop, you can do that with only your laptop trackpad.

Tap on your trackpad with one finger(don't release yet) then scroll up or down with another finger to increase or decrease font size.

Just make sure the dev tools panel is on focus. Tested and working on my HP Pavilion, Windows 8.

Solution 15 - Google Chrome

 you can press Ctrl + / - to zoom and Ctrl 0

Solution 16 - Google Chrome

press ctrl and hover your mouse wheel

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionamosriveraView Question on Stackoverflow
Solution 1 - Google ChromeRonnyView Answer on Stackoverflow
Solution 2 - Google ChromeBoris SmusView Answer on Stackoverflow
Solution 3 - Google ChromeSergii TanchenkoView Answer on Stackoverflow
Solution 4 - Google ChrometremblView Answer on Stackoverflow
Solution 5 - Google ChromeAlvegoView Answer on Stackoverflow
Solution 6 - Google ChromeJames MooreView Answer on Stackoverflow
Solution 7 - Google ChromeTiny JaguarView Answer on Stackoverflow
Solution 8 - Google ChromemicjamkingView Answer on Stackoverflow
Solution 9 - Google ChromeBugs BunnyView Answer on Stackoverflow
Solution 10 - Google ChromejavanoobView Answer on Stackoverflow
Solution 11 - Google ChromeDio PhungView Answer on Stackoverflow
Solution 12 - Google ChromeSharcouxView Answer on Stackoverflow
Solution 13 - Google ChromePabloView Answer on Stackoverflow
Solution 14 - Google ChromeunpluggedView Answer on Stackoverflow
Solution 15 - Google Chromesnehal badheView Answer on Stackoverflow
Solution 16 - Google Chromemubasshir00View Answer on Stackoverflow