Kerning individual characters from the browser, with a little javascript help.
Posted under
Comments
Related Entries
Kerning Type EffectivelyA good tip on an easier, more effective way to kern type for design.
The Kerning GameTest your kerning abilities with this quick online test of ten typeface examples.
Typography for the LonelyA new collection of web typography experiments using standards-based web design techniques.
Kerning with JS
Sep 6, 2011
I’ve recently been experimenting with javascript based typography tools for new projects, most notably Lettering.js which allows for letter control by adding CSS classes to each character, then allowing for adjustment on an individual based level (eg. letter-spacing CSS property). Of course, it’s to be used sparingly and in my case only on large h1′s on any given site. While it’s a great addition to the evolving list of javascript based typography tools available, I found going back and forth between my browser and CSS a bit tedious to make sure the kerning was set the way I intended.
Kern.js is a bookmarklet I found that helps with the process, by actually allowing the kerning to take place right in the browser with a simple click and drag interface. It’s been pretty helpful and accurate so far, a nice example can be found here.
Link: Kern.js Bookmarklet →

Comments