How do you save a pdf with Avenir font using CSS?

Question

I am trying to save a pdf of html text in Google Apps Script. The full script sends a stylized email with the html text but I would like to back up the body of the email as a pdf. Using the below code I am able to save a pdf, but it does not use the Avenir font as I'd expect.

function printToPDF() {
  var htmlMessage = '<html style="font-family: `Avenir`;">Avenir test</html>';
  var folder = DriveApp.getFolderById(folderId).createFolder('test')
  var blob = Utilities.newBlob(htmlMessage, MimeType.HTML, "text.html");
  var pdf = blob.getAs(MimeType.PDF);
  var document = DriveApp.getFolderById(folderId).createFile(pdf);
}

General CSS styling works (followed this post Google Apps Script - Convert HTML with styling to PDF and attach to an email - Create a PDF blob from HTML).

Welcome to [so]. Please add a brief description of your search efforts as is suggested in [ask]. — Rubén, Mar 29 '21 at 20:29

score 0 · Answer 1 · answered Mar 29 '21 at 23:07

I tried to replicate your code, test few font family and found out that not all fonts are accepted in PDF.

Example:

Here I tried using Comic Sans MS.

function printToPDF() {
  var folderId = "id";
  var html = HtmlService.createTemplateFromFile("ABCD");
  var output = html.evaluate();
  var blob = Utilities.newBlob(output.getContent(), MimeType.HTML, "text.html");
  var pdf = blob.getAs(MimeType.PDF);
  DriveApp.getFolderById(folderId).createFile(pdf);
}

ABCD.html

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
    <style>
      body {
        font-family: 'Comic Sans MS';
        font-size: 48px;
      }
    </style>
  </head>
  <body>
    Comic Sans MS    
  </body>
</html>

Output:

Since there is no proper documentation on what are the accepted fonts in PDF, what you can do for now is to search for fonts similar to Avenir and do a trial and error.

How do you save a pdf with Avenir font using CSS?

1 Answers1