Is there any way to disable font anti-aliasing in Chromium (and Chromium-based browsers)?

[Nazo]

So I recently realized what a difference it can make to disable font antialiasing and use fonts in their native sizes. Along with some really readable fonts (my favorite being BigBlue TerminalPlus which is super easy to read at a nice size since I like relatively small fonts and it includes UTF-8 extensions so I don't get empty boxes when Windows pulls its usual stunts) I've found that it has really improved general comfort reading things on screens. Unfortunately, there are two caveats: first, it's really hard to completely disable font anti-aliasing in Windows and for best results I'm having to use MacType which has the definite potential to cause problems with things (though while I've had one thing complain once before I have yet to actually have any actual problems at all.) Second, and much much worse: browsers completely ignore my settings and completely bypass all system rendering to do their own. *Sigh* So this comes to the problem that the browser doesn't give the user any font control whatsoever. You have a single page where you can configure theoretical base fonts -- and then every single site in the world made since CSS will blatantly ignore the defaults and bypass them with its own fonts. Worse: everything insists on subpixel hinting. I've tried configuring ClearType back before I disabled anti-aliasing altogether, but no matter what setting I use I see those colors and they look terrible to me. (Maybe my eyesight is too good and most people see it less clearly? I don't know, but no matter which subpixel order I use it looks terrible and I see the colors.) Luckily at least I finally found out there is a setting to force monochromatic anti-aliasing today, but it still leaves fonts generally looking blurry and smudged to me.

Now, this is just an example, but I threw together a quick image in an old image editor of the difference:

This is just a quick and dirty example. Not really indicative of how the browser does things, but I'd have to go to several different sites forcing different sorts of anti-aliasing to really show what the browser itself does I guess. The real point of this though is just to demonstrate how to my eyes font anti-aliasing just produces blurry text to my own eyes at least. The first line is very clear and easy to read. The second line is a more minimal anti-aliasing that still causes a bunch of blurry areas. The final one is full font smoothing. To me at least it just feels outright blurry. Speaking as someone who reads text on screens for hours at a time, I've found that the first one is just plain easiest on my eyes -- the least strain -- over long periods of time. The last one -- which is fast becoming an official standard in most things -- is the hardest on my eyes.

So people apparently used to be using a custom CSS that would insert a field to disable font anti-aliasing via the CSS. This worked great for a while back before I even really knew about all of this. Unfortunately, quite a while back (Chrome version 37 apparently) they completely removed the custom CSS feature. I've seen something else doing this via an extension to just inject that same one-line code essentially in the same basic fashion, but unfortunately it would appear that the method they used no longer works as it just produces an error. (The post about this was from 2014 or so and it wasn't anything like an official project, just a blog where they simply decided to share their results.) I'm still googling around, but most results lead to unrelated things and posts with people going off on a tangent and not really solving anything. So I guess I'm desperate enough to ask here even though I'll probably have to spend a week explaining why it doesn't matter that most people think they prefer font anti-aliasing, I just want to disable it for myself.

 

[CEpeep]

Chrome draws its own fonts, so it doesn't obey system settings for rendering fonts. You can get user CSS back in Chrome by installing an extension and then making a universal stylesheet, but it still won't affect fonts brought in using JS or ones drawn with SVG. If this is important to you, you should consider switching to a browser that provides more user control over the rendering experience, like Firefox, or a browser that fully obeys system settings for font rendering, like Edge.

More importantly though, it sounds like you could really use a new display. Moving to a monitor with a higher DPI will eliminate the difficulties you are facing here by providing a pixel pitch that your eye cannot distinguish at normal distance, which will eliminate the "blurriness" you're experiencing currently. What resolution and size are your current display?

 

[Nazo]

If this is important to you, you should consider switching to a browser that provides more user control over the rendering experience, like Firefox, or a browser that fully obeys system settings for font rendering, like Edge.

Unfortunately, I've tried switching to Firefox and just find the browser itself to be quite unpleasant in a lot of ways. I don't recall having any better font handling in it however. Even if it does, there's so much that just felt unpleasant about that browser that I'd pretty much end up just as bad off by switching. Anyway, I'm aware it wouldn't fix everything. I just want to fix what I can within it. As I said, I was looking around and ran across stuff like an extension written quite some time ago which no longer works producing an error on the second line out of a mere three lines of code (and unfortunately fixing this is well beyond me.)

More importantly though, it sounds like you could really use a new display. Moving to a monitor with a higher DPI will eliminate the difficulties you are facing here by providing a pixel pitch that your eye cannot distinguish at normal distance, which will eliminate the "blurriness" you're experiencing currently. What resolution and size are your current display?

I'm going to save you a bit of trouble there and state that this just isn't realistic. Yes, this works. On my current phone and tablet fonts look just great to my eyes. (Not so much on my old Samsung Galaxy SIII where I could even see the dithering that the display was producing, so that sets a lower limit.) I'm not sure if they make any monitors with a high enough DPI to even do this, but I do know it would be quite expensive. It could also be troublesome in things like games with the significantly higher resolution, though I'll admit it would mean antialiasing could be off. (I've thought on this basic concept many times.) Basically it would probably have to be something such as a small screen with 4K resolution (or so I presume. It's hard to figure out exactly since my viewing distance to my phone screen is a bit less than to a monitor, but not so much less as to be really significant. We're definitely talking at least double the normal DPI probably.) Even if I could afford it, it's unlikely I'd even find one. Worse, there would be no real options. My current display is one with an IPS panel display for the far far better image quality (namely colors, but even blacks and grays are better for the most part) and I'd truly hate to give that up, but it's about 99% certain such a screen would be the cheaper TN panel type.

 

[CEpeep]

Ok, well if Firefox isn't for you then check out something else. It's just that Chromium/Blink render their own fonts and your ability to customize them will be limited. I don't think you're going to get much traction making Chrome better for you in this regard.

You can get a 28" 4K display for $200-300 these days. Wasn't trying to step on your toes, just proposing a potential solution to your general issue.

 

[Nazo]

Ok, well if Firefox isn't for you then check out something else. It's just that Chromium/Blink render their own fonts and your ability to customize them will be limited. I don't think you're going to get much traction making Chrome better for you in this regard.

Unfortunately I've tried practically everything. I used to be on Opera for the longest time, then they decided to not be Opera anymore and just became yet another Chromium-based browser. At that point in particular I really started trying things out and of course it seemed like Firefox would be the best place to start, so I did indeed start with it. It just feels... Wrong in the way they do everything. I've always felt that way since shortly after they first started out (well, at first once they forked to Firefox to keep things slimmer and all it wasn't too bad, but even then I liked the Opera of the time far better. Once it forked back into being the Mozilla browser instead of Firefox despite the lack of name change -- aka became a messy pile of bloat which was kind of what Firefox was specifically created to NOT be -- it just became unusable for me.) Anything IE or IE-like (there is at least one designed to essentially use its engine but in a much better way -- Gekko I think the main one I used was called) is just plain intolerable though. And yeah, it's truly ironic I ended up on something Chromium based, but there you have it. It's basically because this browser (Sleipnir 4) basically feels the most of anything I've used like what Opera used to be before they essentially quit being Opera. (Still not perfect by a long shot with a lot of stuff that was built into Opera just not nearly as nice. And I'm still upset that no matter what browser I use I can never have the classic Opera speed dial. Both Chrome/Chromium and Firefox have only some pretty awful extensions...) I've also tried again several times since this browser isn't available in Linux and usually end up just using this in WINE instead. (Pretty messy solution...) I'll probably have to try again, but what's left after Firefox and with me staying the heck away from anything IE? (Nevermind personal preference, IE's engine is one of the most exploited pieces of software ever since it makes just such a lovely target.)

You can get a 28" 4K display for $200-300 these days. Wasn't trying to step on your toes, just proposing a potential solution to your general issue.

I don't mean to imply you're stepping on any toes, I'm just saying that isn't realistic. First, I want an IPS panel. The visual quality difference is worth it 100% I assure you. Second, I'm pretty broke right now, so even if we assume it wouldn't cost significantly more (it would) I just can't really afford it. Not to mention, like I said, it would surely cause problems in gaming. (I suppose if I could get something of a high enough DPI a lower resolution might be ok, but it would be pushing things for this videocard and CPU to keep up which means that not only would it wreck my design policy of keeping this system pretty efficient, but it would be that much more money spent.) Right now it's more or less at the perfect balance of things in that respect other than the fact that true FSAA has disappeared from modern games which is more than just a little bit upsetting. Also, you have to admit that $200+ is a bit much to spend just over a font issue that almost exclusively exists in a browser... Don't get me wrong, some stuff would be nicer, but overall definitely not worth it.

 

[pxc]

Chrome 37 and later use DirectWrite, so if you're on Windows 7/8 you can control anti-aliasing via the "Adjust ClearType text" control panel applet. But like you said, some sites use font-smoothing and Chrome removed the options to use custom CSS a while ago which could override the site's CSS.

The Vivaldi browser does support controlling font AA.

 

[Nazo]

I tried turning off DirectWrite and it caused a lot of serious visual problems but didn't really disable anti-aliasing. That much appears to be done by the browser itself.

Anyway, I've pretty much figured it out now -- albeit in a really extreme manner. First, it turns out that you can disable anti-aliasing in Windows after all. You have to go to the system settings in the control panel and in the performance section where it has stuff like how much the system uses animations and etc. Interestingly this even disables it within the browser. A few things come out really ugly for obvious reasons (why can't we have adaptive anti-aliasing applying only where needed? *Sigh*) but the stuff that is the correct size looks so amazingly clear and clean it's positively ridiculous. And I just got a "laplet" (a "tablet pc" -- not tablet, but PC compatible system which used to be a lot more common but also used to be ridiculously expensive, super heavy, and super expensive as well as having horrible battery life and getting really hot -- which can "convert" to a laptop by docking in a nice keyboard + mouse base with an extra USB connector.) Disabling it the same way there has really significantly helped with overall readability. It runs on Windows 10, so I guess I can say this method works on 7 and 10 (presumably including 8/8.1 by default and I believe XP had the same settings as well -- which would include Vista if so.) So I guess for me this is probably the best overall solution.

BTW, recently -- after I initially wrote this -- a response came in on that old bug report. Apparently: "you only need to enable the extensions-on-chrome-urls flag and re-launch the browser" with a link to this: Can you access chrome:// pages from an extension?