Using the advanced theme editor to customize invoice PDFs

When you export an invoice to PDF, Intervals will apply the colors, fonts, and formatting from your current theme. While that works for most scenarios, there are times when you may want to customize the look of an invoice when saving it as a PDF. For example, some of our darker themes will produce a PDF that is not ideal for printing.

The CSS for your account can be edited by going to Options (⚙) -> Settings & Defaults and clicking on the Advanced Theme Editor link in the right column. Here is an example of how to use the advanced theme editor to customize invoice PDFs and make the background white and the text a charcoal grey.

.content-pdf {
    background: #fff;
}
.content-pdf table td.invoiceTop,
.content-pdf table.zebra {
    background: #fff !important;
}
.content-pdf table.zebra th {
    background: #fff;
}
.content-pdf .newTable>thead>tr>th,
.content-pdf .newTable>tfoot>tr>th,
.content-pdf .cal>.head .day,
.content-pdf .table.is-headered thead {
    background: #fff;
    color: #333;
}

The content-pdf class is set on the body tag. So anything on the PDF below that tag can be customized.