How to use Font Awesome in a Desktop app 

By David Roessli

Posted in daily

Tags :

Font Awesome is the iconic font designed for use with Twitter Bootstrap. With over 200 icons in a single collection, Font Awesome is a pictographic language of web-related actions.

I recently run into the situation where I had to use a character in a desktop app. So I installed the font in Font Book and tried to map out the character-glyph correspondance.

font_awesome_font_book.png

It turns out that Font Awesome uses the Unicode Private Use Area to make sure screen readers don't read the characters off, but this makes it difficult to figure out which characters are associated with the glyphs.

font_awesome_ai_type_preferences.png

Here is how to get the font work in Adobe's CS:

  1. install the font by dragging it to Font Book
  2. open your favourite Adobe CS app and navigate to the "Preferences > Typeí¢â‚¬Â¦í¢â‚¬Â
  3. uncheck «Enable missing glyph protectioní¢â‚¬Â
  4. use @parkerault correspondance sheet to copy and paste the characters your are interested in.

Et voilíƒÂ .

Posted a response ? — Webmention it

This site uses webmentions. If you've posted a response and need to manually notify me, you can enter the URL of your response below.

Comments and responses

  • 06 Dec 2012

    Dave Horn:

    Hi there,
    I’m having no luck seeing the entire fontset in Adobe InDesign CS6, Mac (OS 10.6.8). No ‘Enable Glyph Protection’ setting exists. I can see a small subset of the fontset in both Fontbook and InDesign’s Glyph palette.
    What have I overlooked?
    Cheers,
    -dave^h.

  • 06 Dec 2012

    David Roessli:

    Dave,
    I found this on Adobe’s website:
    http://helpx.adobe.com/mena/using/arabic-hebrew.html#id_39921
    Legacy font support
    Available in InDesign CS6, Illustrator CS6, Photoshop CS6
    Fonts that have been traditionally used (for example, AXT fonts) can continue to be used in this release of the software. However, it is recommended that newer Open Type fonts be used for text-based elements.
    Missing Glyph Protection (Edit > Preferences > Advanced Type) is enabled by default. Text is handled automatically, where glyphs are not available in the font you are using.

  • 16 Apr 2013

    David Roessli:

    Things have changed with version 3! Font Awesome comes with an OTF version and Copy & Paste page for easy reference!

  • 11 Nov 2014

    David Roessli:

    Apparently, Pages v5.5.1 doesn’t render v4.2 of Font Awesome correctly. It’s okay on screen, but when you print of generate a PDF, the characters come out much smaller.
    This can be fixed by using the TrueType (TTF) version of the font instead of the OTF – not ideal, but it works…

Want more ? — prev/next entries