Jump to content

How to handle non-default fonts on HTML games


plicatibu
 Share

Recommended Posts

You can use web fonts. With enough font files provided, most of target devices and browsers will be able to load the correct font.

There's also a workaround though - use bitmap fonts. That is, all relevant glyphs are rendered into a texture sheet, and then drawn accordingly to display separate characters. Implementations of popular formats like BMFont exist for most of commonly used frameworks.

Second method may require slightly more memory for larger fonts, but gives consistent results regardless of browser and device rendering specifics.

Link to comment
Share on other sites

I typically have this inline code in main html file:

        <style type="text/css">            @font-face {                font-family: "kenpixel";                font-weight: normal;                src: url("./assets/kenpixel.woff") format("woff"), url("./assets/kenpixel.otf") format("opentype");            }        </style>

woff is for Firefox if I remember correctly. Most other browsers can load otf fonts. There are many online tools to convert from ttf to these formats.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
 Share

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...