I’ve always loved the posters from HATCH SHOW PRINT. You can see one above. See how they expand the type size until it fills the line? (“Johnny” is a smaller size than “Cash”, and “the fabulous” is even smaller.) I love that.
Click on the image here to go check out HATCHSHOW.js.
The plugin is really simple. All you do is wrap the “lines” you want the effect applied to with a <span class=”hsjs”>, and it does the rest. You’ll probably want to make a few adjustments for the line height and for individual kerning adjustments. But the plugin does most of the work.
As you’ll see if you check out the HATCHSHOW page, the font-size for every letter on that page was generated dynamically. Cue theremin: By an algorithm. (Ooooo!)
The more astute among you are probably saying “Yeah, but this is the same thing Fittext.js does, isn’t it?” Good question, but no. Fittext is for a single line — a headline or the name of the page / service / whatever. HATCHSHOW is intended for multi-line displays, kind of like what you see in that concert poster up top.
If you build anything cool with it, be sure to let me know! And if you want the code, it’s right on the HATCHSHOW page (click on the “check out the code” link at the bottom, then scroll down).