6

I am trying to use Bootstrap's Glyphicons (FontAwesome) in Photoshop. I've installed the font, but how to I actually type the icon characters?

I found this page where I can copy/paste the icons listed:
http://fortawesome.github.io/Font-Awesome/cheatsheet/

However, I don't see the glyphicon-stats listed on that page and I'd like to use it... It's listed on:
http://getbootstrap.com/components/

Thanks

Ravimallya
  • 6,550
  • 2
  • 41
  • 75
user1960364
  • 1,951
  • 6
  • 28
  • 47
  • 1
    This question appears to be off-topic because it isn't about programming – user229044 Jul 01 '14 at 01:37
  • It is about programming in the sense that FontAwesome is a font created and used by programmers working primarily with Bootstrap. I'm not asking how to use Photoshop, I'm asking how to use this Bootstrap font. – user1960364 Jul 01 '14 at 01:43
  • 1
    You're asking how to install a font into Photoshop. That's pretty off-topic. – user229044 Jul 01 '14 at 01:44
  • No, the font is installed, I'm asking how to access the non-standard characters (icons) in this font. I stated Photoshop, but it stands to reason in any text editor. – user1960364 Jul 01 '14 at 01:45
  • 1
    Already answered here http://superuser.com/questions/532556/how-can-i-use-font-awesome-in-photoshop-and-fireworks and this may help you. I am not sure how he got it. http://www.codestore.net/store.nsf/unid/BLOG-20131014-0451 – Ravimallya Jul 01 '14 at 12:20

3 Answers3

7

With the help of Ravimallya's comment, I was able to find the characters in the Character Map starting at Unicode F000.

  1. Open Character Map in Windows
    • Press Win + S to search
    • Type "Character Map", or as many characters as needed.
    • Press when the Character Map program is selected.
  2. Check "Advanced View"
  3. Type F000 in "Go to Unicode :"
  4. Find/Copy the character you wish to use.
  5. Paste the character in a text object within' your editor.
  6. Ensure the text object is set to use the FontAwesome font.
user1960364
  • 1,951
  • 6
  • 28
  • 47
4

It's actually pretty simple.

1) Head over to http://fontawesome.io/cheatsheet/

2) Just copy/paste the character into Photoshop (as a Text layer).

3) Make sure to set the Font to FontAwesome for that layer, and your icon will look perfect in Photoshop.

paul.rmz
  • 69
  • 2
  • Please take the time to read the question in its entirety. As stated in the question, there are some icons that are not included in the 'cheatsheet' - the question was asking how to use them. – user1960364 Dec 19 '14 at 03:35
2

I think we have much much better way, and it's easier than you think:

  1. Download FontAwesome from their website: http://fontawesome.io/
  2. Install the font in your operating system
  3. Open Photoshop and the document you want to edit
  4. Go to: Menu > Window > Glyphs
  5. In the "Glyphs" window, choose FontAwesome
  6. Keep the "Glyphs" window opened
  7. Take the "Text" tool and click somewhere in document area (just like writing something)
  8. Set the actual font to FontAvesome and the size as you wish
  9. In the "Glyphs" window, double-click on the symbol that you want to insert
  10. The symbol as been inserted

If you want to vectorize the icon, you can do so by going to: Menu > Text > Convert to shape

AntoineB
  • 4,535
  • 5
  • 28
  • 61
adamgub
  • 21
  • 3