1. Set Font
The font must be a vector based pixel font (such as miniml fonts) to work properly. Bitmap pixel fonts will not work as shown. For webfonts name the "font-family" with the same 'Fontname' you created in the @font-face declaration (see 3. Webfont Use).

2. Font Size
Miniml fonts must set to any multiple of 8 (16, 24, 32, etc.) With a Retina display you can set the font at 4 for the smallest pixel font possible. The first 2 numbers after the font name refer to the cap height in pixels. The last 2 numbers refer to the font style.

3. Webfont Use
Use the following stylesheet code:

@font-face { font-family: 'Fontname';
src: url('fontname-webfont.eot');
src: url('fontname-webfont.eot?#iefix') format('embedded-opentype'),
url('fontname-webfont.woff') format('woff'),
url('fontname-webfont.ttf') format('truetype');
font-weight: normal;
font-style: normal;

4. Adjust Spacing
Use the CSS property "letter-spacing" to adjust the character spacing. Use the CSS property "line-height" to adjust line spacing.

5. Turn Aliasing to None
When using image editing applications turn Aliasing setting to None to keep fonts aliased, otherwise the fonts will appear blurry.

6. Fonts in Motion
You need to round the x and y values to whole values to keep the fonts aliased when using the fonts in motion.