Comment by calibas
3 years ago
When viewing the site in Firefox, the font in the paragraphs has a very subtle rainbow effect. Here's a screenshot of it zoomed in: https://i.imgur.com/ir0MmPq.png
I was wondering how they achieved that effect, but it doesn't seem intentional. It's not part of the CSS, and I only see it in FF, doesn't happen in Chrome.
It goes away if I switch fonts, it looks like it's some weird result of how Firefox renders the site's "BitGeneva12" font. Another odd thing, it goes away when I used FF's "Take Screenshot" feature. Also only happens when the font is 12px in size.
It's probably due to anti-aliasing. A similar thing happens on some versions of Windows with ClearType turned on: https://en.wikipedia.org/wiki/ClearType
Webkit browsers have `-webkit-font-smoothing: none`. Does an equivalent exist for FF?
font-smooth: never Should be working on Firefox.
1 reply →
I assumed this was intentional to sorta look weird and retro. Sorta wild it's just Firefox messing it up.
It's not just Firefox, it's reproducible on Chromium browsers on Windows (10) as well.
Sub pixel antialiasing gone wrong?
On your screenshot I can only see the fonts aren't quite sharp, the rainbow effect is probably from your display trying to render these subpixel differences.
Looks fine in firefox on Linux: https://imgur.com/lmxTyrt.png