I use Firefox with the "Allow sites to choose their own fonts" option unchecked, so everything displays in my preferred font. I like it this way. The only problem is that some irritating websites (e.g., Github and Tumblr) decide to use custom fonts not to display text, but to create icons from the glyphs. What I would like is a way to set more than one font as "allowed" in Firefox: if a site tries to use one of the allowed fonts, okay, otherwise it uses my fonts.

Similar problems are described in a Mozilla support question, a Firefox bug report and another question on here. I can find no satisfactory solution.

As far as I can tell, CSS-based solutions, such as a custom user stylesheet, can't work, because I can't use CSS to select based on what font a given site is trying to display. That is, in theory it could be possible to write a "second stage" CSS rule that selects only elements which have their CSS font-family attribute set to a certain font, but in practice (as far as I know) CSS doesn't allow that. This also seems to mean that the Stylish extension is not a solution.

As a test, I also tried downloading Github's octicon font and installing it on my system, hoping that this would let Firefox do auto font substitution for those glyphs (the way it does if I view text in other alphabets). It doesn't work.

The following criteria are essential for to consider something a "solution":

1. It must be a whitelist, not a blacklist --- that is, it must say "these fonts are allowed" not "these fonts are not allowed" --- and the fallback behavior for non-whitelisted fonts must be to use my specified fonts. I'm not interested in solutions that require me to manually "enable" my-fonts-only behavior for certain websites. The default behavior has to be to use my fonts.
2. It must be font-specific, not just site-specific. I don't want to, e.g., allow Github to use its own fonts. I want to allow Github to use only its dumb octicons fonts where it uses them, while using my fonts for the rest of the site UI. I'm okay with a solution that lets me restrict by font and site, though. Basically, I'd be okay with a solution where I can say "let anyone use font X" or "let only site Y use font X", but not one that only lets me say "let site Y use whatever fonts it wants".
3. It must not involve me writing any kind of custom stylesheet or script per site. This means "you can write a greasemonkey script to do that" is not a solution unless there is an existing greasemonkey script that does it once and for all. I'm okay with installing something and setting it up, and obviously I'll have to manage the whitelist myself, but it's not a solution if I have to tweak the tool for each site (e.g., by modifying it to "know" about that site's particular CSS).

Is there any solution for this? I'm curious whether I'm the only one who actually uses the "don't let sites use their own fonts" option, and, if not, how other people deal with this annoyance.

I use Firefox with the "Allow sites to choose their own fonts" option unchecked, so everything displays in my preferred font. I like it this way. The only problem is that some irritating websites (e.g., Github and Tumblr) decide to use custom fonts not to display text, but to create icons from the glyphs. What I would like is a way to set more than one font as "allowed" in Firefox: if a site tries to use one of the allowed fonts, okay, otherwise it uses my fonts.

Similar problems are described in a Mozilla support question, a Firefox bug report and another question on here. I can find no satisfactory solution.

As far as I can tell, CSS-based solutions, such as a custom user stylesheet, can't work, because I can't use CSS to select based on what font a given site is trying to display. That is, in theory it could be possible to write a "second stage" CSS rule that selects only elements which have their CSS font-family attribute set to a certain font, but in practice (as far as I know) CSS doesn't allow that. This also seems to mean that the Stylish extension is not a solution.

As a test, I also tried downloading Github's octicon font and installing it on my system, hoping that this would let Firefox do auto font substitution for those glyphs (the way it does if I view text in other alphabets). It doesn't work.

The following criteria are essential for to consider something a "solution":

1. It must be a whitelist, not a blacklist --- that is, it must say "these fonts are allowed" not "these fonts are not allowed" --- and the fallback behavior for non-whitelisted fonts must be to use my specified fonts. I'm not interested in solutions that require me to manually "enable" my-fonts-only behavior for certain websites. The default behavior has to be to use my fonts.
2. It must be font-specific, not just site-specific. I don't want to, e.g., allow Github to use its own fonts. I want to allow Github to use only its dumb octicons fonts where it uses them, while using my fonts for the rest of the site UI. I'm okay with a solution that lets me restrict by font and site, though. Basically, I'd be okay with a solution where I can say "let anyone use font X" or "let only site Y use font X", but not one that only lets me say "let site Y use whatever fonts it wants".
3. It must not involve me writing any kind of custom stylesheet or script per site. This means "you can write a greasemonkey script to do that" is not a solution unless there is an existing greasemonkey script that does it once and for all. I'm okay with installing something and setting it up, and obviously I'll have to manage the whitelist myself, but it's not a solution if I have to tweak the tool for each site (e.g., by modifying it to "know" about that site's particular CSS).

Is there any solution for this? I'm curious whether I'm the only one who actually uses the "don't let sites use their own fonts" option, and, if not, how other people deal with this annoyance.