Sunday, March 2, 2014

Disabling Anti-Aliasing on Chrome

Update:  To make it easier, I uploaded the files to https://github.com/lazyhacker/chromecss.  Just download it and point your Chrome browser to use it as an extension.

While I love Chrome and it's my favorite browser, the one thing I really dislike about it is the way it handles anti-aliasing.  I really don't like the seeing soft fuzziness around fonts.  It always makes me feel it's blurry.

Previously, to disable the anti-alias in Chrome you would create a "User Stylesheet\Custom.css" file (Chrome doesn't use the OS's font setting) with the following:

body { -webkit-font-smoothing: none; }

But starting with version 33, Chrome no longer load the user style sheet so one day I started Chrome and everything looked fuzzy again!

The "new" way around this to create your own Chrome extension.   All this involves is adding one new file.

Create a new directory and add a new file called manifest.json.  Have the following in it:

{    "manifest_version": 2,    "name": "Disable AntiAlias in Chrome",    "version": "0.1",    "content_scripts": [{        "matches": ["https://*/*", "http://*/*"],        "css": ["style.css"]    }]  }

Then create a file that matches the name used in the line "css": ["style.css"].  In this example, create a file called style.css.

Style.css should have the same thing as what was in the Custom.css file above.

Then on the url bar in Chrome, type "chrome://extensions/" (without the quotes).  Enable the "developer mode" checkbox and click on the "Load unpacked extension" button.  Select the directory that contains your newly created file.

Done.