Typography is indeed one of the most crucial components of every good web design. As a novice or professional web designer, knowing about the best typography tools, frameworks and libraries is definitely a plus point.
All these resources can aid you in dealing with web design typography in a better manner, offering you extensive control over fonts used on the web. Enjoy!
As a handy plugin, FlowType will dynamically adjust the font size in accordance to the width of the wrapper under focus. Additionally, you can use the plugin for applying an ideal count of characters per line along with screen of variable width specification. FlowType can be easily downloaded from GitHub and plays a vital role in accomplishing the most legible typography which includes 45 and 75 characters on a per line basis.
As a complete framework for setting up typography in a web design, Typeplate is shipped with some stunning basic typographic styles that address critical elements within web design such as colors, scaling, dropcap, small capital, hyphenation, code block, blockquote, scaling and a lot of other interesting stuff.
As a brilliant typography tool, Gridlover allows you to establish a typographic system wherein there is a fully adjustable CSS for the line heights, font sizes and all margins. As an easy-to-use tool, Gridlover allows you to achieve perfect typography for your web design.
Hatchshow is a special web typography plugin which expands the size of your font, thereby filling in the entire width of the font container. Utilizing a specific algorithms, Hatchshow will measure your container’s width, length of font characters and finally append the appropriate font size.
7. Modular Scale
Modular Scale is a handy typography tool that will generate an ideal font along with proper scaling for the body and heading of your text. Output received with the use of Modular Scale is available in Sass and should hence be used in conjunction with Sass library.
FFFFallback is a brilliant web typography tool that allows you to find stack of font that would further degrade in a graceful manner. Available in the form of a bookmarklet, FFFFallback will analyze will allow you to analyze the family font on a particular page, followed by suggesting you the most appropriate font.
As a remarkable pack of CSS rules, TypeSettings is available in Sass and Stylus. You can use it for defining vertical rhythm, font scaling and reasonable ratio for your web typography.