54

Recently, Stack Exchange decided to switch to system fonts. For those of you who prefered the old appearance, or would like a different font to appear in code blocks or across the site as a whole, Custom Fonts is a user script I wrote this morning to allow just that.

Features

Custom Fonts allows rules to be set for different sites, which can specify a sans serif, serif, and monospace font. A default can also be specified, allowing you to choose between sans serif and serif for any site.

Custom Fonts initially doesn't change anything (unless you download one with a preset), but on lines 26 and 27 are rules that revert all of Stack Exchange to its original fonts (once un-commented). Custom rules can be written, and there is a short reference in the comments under the Rules object.

Download

Custom Fonts is a user script, meaning that it requires Greasemonkey (Firefox or browsers that support Firefox extensions) or Tampermonkey (Chrome or browsers that support Chrome extensions) to be installed.

Custom Fonts 1.2.4

Custom Fonts 1.2.4, with original fonts

Custom Fonts 1.2.4, with Roboto + Roboto Mono

Improve this question
18
  • 10
    Thank you very much. I'm thinking about writing a post for a request for this to be in our preferences, because I much preferred the old fonts. This looks... weird.
    – Ollie
    May 10, 2021 at 17:09
  • 5
    Usually, I think these things go a.) on StackApps, and perhaps b.) get linked in an answer to the announcement post. I've never seen them get their own question before, hence me asking before unilaterally moderating it...Sure, more people will find it here, but like Mast said that's not a reason to be off-topic :P I don't post my IPS questions on SO just because there's more people checking SO!
    – Tinkeringbell
    May 10, 2021 at 17:15
  • 4
    Thank you soooo much! This helps my eyes - I just can't read the light font the new update provided.
    – Rory Alsop
    May 10, 2021 at 17:18
  • 2
    Can you split this in a question and an self-answer? People get confused that it is all in one.
    – rene ♦
    May 10, 2021 at 17:20
  • 2
    @Tinkeringbell - I honestly think this should go in the main announcement so that people can more easily revert this awful font.
    – Valorum
    May 10, 2021 at 17:20
  • @rene Not sure about that, seems like it'd be more confusing to do it that way IMO
    – Radvylf Programs
    May 10, 2021 at 17:21
  • @RedwolfPrograms You're genius! Finally I can have the nice serif font back which was tragically lost in the Great Undesign of 2018, in which a lot of sites lost their custom design!
    – samcarter_waiting_for_siparty
    May 10, 2021 at 17:46
  • 1
    I made a lightweight version with 3 lines.
    – Spectric
    May 10, 2021 at 19:08
  • 1
    @Spectric There's a reason it's longer than that. There are lots of things that skips.
    – Radvylf Programs
    May 10, 2021 at 19:08
  • For the record, any solutions written in JS tend to be somewhat slow and have a startup delay. This is absolute overkill compared to using a userstyle (which also loads substantially faster)
    – Zoe is on strike
    May 11, 2021 at 8:33
  • @Zoe I would recommend using a userstyle over this if you have the option, though this script is designed to (ideally) load the new CSS almost instantly (uses @run-at document-start) so there shouldn't be a visible delay very often. A lot more people have userscript managers installed than userstyle ones, so I figured this would be useful to share, at least as a temporary solution.
    – Radvylf Programs
    May 11, 2021 at 12:45
  • Hi! Version 1.2.2 doesn't work in GreaseMonkey in FF because of @match https://stackexchange.com. This line wasn't there in 1.2.1, which does work fine.
    – HolyBlackCat
    May 17, 2021 at 17:11
  • 1
    @HolyBlackCat Will fix. I also need to add @excludes for chat and the API
    – Radvylf Programs
    May 17, 2021 at 17:39
  • 1
    @HolyBlackCat Fixed
    – Radvylf Programs
    May 17, 2021 at 17:46
  • When running at document-start the <head> and <body> elements will commonly not yet exist. The element which is guaranteed to exist and to which you can .appendChild is the document.documentElement. However, given that using document.documentElement.appendChild at that time will result in your <style> being before the <head> in the document, you will need to make sure that the CSS rules have a higher specificity than the ones you're wanting to replace, because they will be before, not after, any rules in CSS provided by the page. (continued)
    – Makyen
    May 18, 2021 at 0:10

0

Reset to default

You must log in to answer this question.

Browse other questions tagged .