Creating meaningful headlines at mixed height?
I have a design that contains a lot of mixed-height three line headings. Probably the easiest way to explain the appearance is with an example:
(To do this, ignore the fact that the last line has two words.)
Everything is fully justified, but the font size and kerning changes depending on the word length.
Is there a way to do this using JavaScript or CSS?
+3
source to share
2 answers
I've looked over a boatload of libraries for this project, including:
- FitText.js
- Couldn't get it to work so that different lines have different sizes (e.g. justified but not mixed - height).
- BigText.js
- Couldn't get it to work at all.
- Stretch
- I forgot the problem with this, but it didn't work for my purposes.
- Winner: SlabText
- This is what I have used and it works fantastic.
+2
source to share
You can take a look at CSS Kerning Correction for the CSS part and take a look at http://kerningjs.com/ ?
0
source to share