Huge collection of Free Grunge style fonts for Lovely websites.

Grunge is one of my most favorite font styles. Clean and beautiful designs became boring and distortion, old and worn out feel brought something new in. You may always distort fonts yourself, but it’s always nice if there are free fonts out there you may use right away. I put together a collection of my favorite free grunge fonts. If you are a grunge fan like me, do not hesitate and add them to your font library.

Anarchy

Armalite rifle

Creaky frank

Crookiid veredgf

Continue reading

Typechart – Free Resource for designer & developers to Browse Web Type, Grab CSS.

Typechart lets you flip through, preview and compare web typography while retrieving the CSS.

  • Browse typographic styles. (See “anatomy of a style” below)
  • Download CSS. { 1 }
  • Compare Windows (ClearType) rendering { 3 } with Apple font rendering { 2 }
  • Each style corresponds with a “style ID” { 4 }, which allows you to annotate prototypes and retrieve the css while coding.

Continue reading

TypeSelect: selectable custom fonts on the web, controlled via CSS and Jquery

TypeSelect is a JavaScript-based solution for using selectable custom fonts on the web.

It combines the power of typeface.js, jQuery, the canvas, toDataURL, CSS background properties & real overlayed text to accomplish this feature.

TypeSelect

TypeSelect is very easy to understand & implement. It is totally controlled via CSS & no server-side files are required.

It has support for double/triple-click selections, UTF-8 characters & gracefully degrades in IE6.

Continue reading

Optimal Line Length Principle Applied to Web Design

The other day I pointed out some of the differences between web design and print design. It started me thinking about some of the things I learned as a print designer that are also applicable to web design. One of the most useful is the Principle of Optimal Line Length. It states that, for any given font-size of a multiple-line block of type (like a paragraph), there is a range of line lengths and line-heights that most people consider easily readable.

optimal line length

Those 3 attributes—font-size, line-height, line length—are inter-related.* Change one, and you may need to change at least one of the others for most people to consider the text readable. In simple terms it means that, the wider the line length, the greater the line-height must be. Or, the bigger the font, the wider the line length. Or, the greater the line-height, the bigger the font. Continue reading

Ultimate List of 32 Font And Typography Tools

1.TypeTester

The Typetester is an online application for comparison of the fonts for the screen. Its primary role is to make web designer?s life easier. As the new fonts are bundled into operating systems, the list of the common fonts will be updated.

typetester-font-toolbox

2.IdentiFont

Identifont is the largest independent directory of typefaces on the Internet. It provides a range of features to help you locate fonts or find information about fonts:

  • Find fonts by appearance
  • Find fonts by name
  • Find fonts by similarity
  • Find picture and symbol fonts
  • Find designers and publishers

identifont-font-toolbox

Continue reading