Using Custom Fonts

It turns out that it is quite easy to use custom fonts in an App Studio project. This is useful if you need a specialized font (not one of the official 13) or want to give your app a unique look. Here’s a step by step guide:

  1. Put the font file in your project directory. It should be in .ttf format.
  2. Drag it from there into your Project Explorer
  3. Add this line to extraheaders in Project CSS:
    @font-face {font-family: sansation; src: url('Sansation_Light.ttf');}
    

    4. Set the fontfamily of your controls to the name of your font face. In this case, it would be ‘sansation’.

    That’s it!

    (See the CustomFont sample in folder 2 to try it out.)