How to insert your own fonts on a template

Created: 2020-08-26
Last updated: 2020-08-26

Post view count: 55

If you are creating your own invoice template and you want to use custom fonts in it, you can add them in two ways: 

Install fonts in the CSS file as described below

@font-face {
    font-family: 'FONT-NAME';
    src: url('FONT-FILE-PATH.eot');
    src: url('FONT-FILE-PATH.eot') format('embedded-opentype'),
         url('FONT-FILE-PATH.woff') format('woff'),
         url('FONT-FILE-PATH.ttf') format('truetype'),
         url('FONT-FILE-PATH.svg') format('svg');
    font-weight: normal;
    font-style: normal;


or download the fonts from google fonts as shown below:

<link href="//​:400,700" rel="stylesheet" type="text/css" />

The downloaded font might look like this:

@import url(''); 

You need to create a new template through Settings > Account Settings > Invoice templates, select the base template, and at the top of the CSS add lines with import and:

font-family:'font name'; 


when adding fonts from your own server, you must configure your own server accordingly. This method is called CORS (Cross-origin resource sharing). Here is a description of what to configure on your own server:

General description of CORS:


Sample CORS for AWS S3:


<?xml version="1.0" encoding="UTF-8"?>
<CORSConfiguration xmlns="">



Add Comment