How to use custom fonts in Heroku apps

I run PhantomJS in a Heroku app and use it to generate PDFs from a website.  It works very well, but I noticed that Japanese texts are not rendered correctly in the generated PDFs.

The reason is simple. PhantomJS uses the system fonts to generate the PDFs. Out of the box, Heroku only has a couple of system fonts pre-installed and none of them support Asian languages.

Luckily there is an easy way how to install your own fonts in a Heroku app.

First you need to have your custom font in a format which is supported by Linux/Ubuntu as this is the underlying system of each Heroku app. For Japanese you can download the fonts from the same source as the official Ubuntu package:

Then you create a folder called .fonts (including the dot) in your app root directory and copy all necessary fonts inside.

Commit and push your app to Heroku. That's it!

One last tip: Make sure you don't install too many or too big fonts as they can increase the slug size significant. Heroku limits the slug size of each app to 300MB.