Lettering.js, a lightweight and easy to use Javascript <span> injector for radical web typography aims to fill this gap.

It simply divides any given element into pieces of <span>s wrapping each letter with a custom class.

Just like <h1>WRD</h1> into:

<h1>
<span>W</span>
<span>R</span>
<span>D</span>
</h1>

After that, we just need to create the styles for each letter on the CSS side to create dynamic awesome outputs.

Features + Uses

Web type is exploding all over the web but CSS currently doesn’t offer complete down-to-the-letter control. So we created a jQuery plugin to give you that control. Here are a few example of what can easily be done with Lettering.js:

P.S. Lettering.js can also split words besides the letters.