ianhan/BitmapFonts

Feature request: create installable font files

Closed this issue · 3 comments

MattyBalaam commented

This is a great resource, and I wonder if there is some way of making it even more amazing by converting into usable font files, e.g. .ttf or .woff

raphaelbastide commented

Font formats (otf, ttf, woff…) does not support colours. Color fonts do but they are way less popular and their support is still poor. However, with a bit of JS and CSS, it would be possible to swipe text strings on a web page with bitmap fonts glyphs. It’s totally hacky but can be lots of fun. Here is what can be done:

  1. Chose a Bitmap font tile map image and assign its tile with and height, just like this page does
  2. Assign each tile a character, manually
  3. Generate a file that associates to each character, a position in the map e.g.A:{x:0,y:0},B:{x:32,y:0}
  4. On the web page one wants to embellish, split each text string into a list of character, wrap it into <span> with generated CSS background pointing to the right glyph’s area.

A quick prototype
Edit: a bit more polished demo

  • 👍4
MattyBalaam commented

That's cool, thanks for the fun hack.

  • 👍1
Mehedi588 commented
  • 👍1