Too many different monospace fonts in Developer tools

RESOLVED FIXED in Firefox 26


6 years ago
8 months ago


(Reporter: fvsch, Assigned: harth)


(Blocks: 1 bug)

24 Branch
Firefox 26

Firefox Tracking Flags

(Not tracked)



(3 attachments)



6 years ago
Created attachment 790374 [details]
Combined screenshot: font discrepancy

The Developer Tools use at least 3 different monospace font families for code/monospace text. See the attached screenshot for an example in Firefox 24 on OSX, with a funky-looking user-defined font for web page text (that's font number 2 in the screenshot).

I’d argue that using a single font family makes more design sense.
Also, users might be puzzled if their pref for monospace fonts (from “Preferences > Content > Fonts & Colors > Monospace”) that usually apply to Web content also alter the Devtools UI. (Although the source view in FF has always done that.)
See Also: → bug 858765

Comment 1

6 years ago
Created attachment 790398 [details]
Combined screenshot: font discrepancy no more?

After updating to FF 25.0a2, I’m only seeing 2 fonts instead of 3.
- Console: seems to be using the system default (looks like Menlo in my case).
- Inspector, Debugger, Style Editor: seem to be using the user pref (with a fixed size in Inspector, and the user-defined size in Debugger and Style Editor).

It might still be a good thing to use the same font (from the same source) in Console and the other tools.
Ever confirmed: true


6 years ago
Assignee: nobody → fayearthur

Comment 2

6 years ago
Created attachment 794251 [details] [diff] [review]
Use "devtools-monospace" class in all tools, increase monospace size on OS X

This patch makes devtools use only one monospace font. Any element that had a monospace font now gets the "devtools-monospace" class. I didn't touch the source editor, the two fonts happen to be in sync right now though.

In addition, the CSS autocomplete popup now uses a monospace font.

The monospace font size was increased a bit on OS X, after many (a ton) of complaints about it being too small. It was decreased a bit on Linux. It looks on par with the source editor now.

Try builds:
Attachment #794251 - Flags: review?(paul)


6 years ago
Attachment #794251 - Flags: review?(paul) → review+


6 years ago
Duplicate of this bug: 855518
Last Resolved: 6 years ago
Resolution: --- → FIXED
Whiteboard: [fixed-in-fx-team]
Target Milestone: --- → Firefox 26
Blocks: 916766


8 months ago
Product: Firefox → DevTools
You need to log in before you can comment on or make changes to this bug.