Sub-pixel antialiasing rules I recently had an issue with sub-pixel anti-aliasing of text, which produces very harsh colours and made me wonder how it is meant to be done properly:


  


I've drawn some cases of a black tile covering thirds of pixels below.



The colours match the ones I'm seeing, however when I look at properly antialiased text, the result is not nearly as bright and distracting:


  


I assume there has to be a balance between a good light intensity and the right colour. What methods are used for sub-pixel anti-aliasing that give such good results?



Update:

I've rendered a white teapot to an image with 3x width and with multisampling. Below I compare averaging every 3 pixels with assigning each to RGB. The colours still seem overly bright in some cases (especially compared to the example above from here), not that my phone captures them well.






OK, so my monitor needs a little dusting
I'm not sure what happens there. Looking at the rendering of "considerations" in your example, the "cons" looks like what you get when you do crude sub pixel anti-aliasing, without applying the necessary "fix up" to make it look good. But then the "der" in the same word looks like there's no sub-pixel anti-aliasing.

You can find a good article about how good looking sub-pixel anti-aliasing works here https://www.grc.com/ct/ctwhat.htm and for the "fix up" part here https://www.grc.com/ct/freeandclear.htm and here https://www.grc.com/ct/cttech.htm

What it comes down to is: if you just compute the R/G/B intensities by calculating the covered area for each sub-pixel, the resulting color fringes are very ugly/irritating. To fix it you have to apply a horizontal blur/low-pass filter to the sub-pixel image. The result is an image that's less sharp but also has far less saturated colors. I.e. something like your "Check you" example.