Skip to content
PPDFInvoiceAPI
DOCS/ Branding with {{brand.*}}

CORE

Branding with {{brand.*}}

Save your logo, colour and company details once. They're injected into every template render as {{brand.*}} — so one template renders on-brand for every invoice.

Set your kit

Open Dashboard → Brand kit and set three things, once:

  • A logo — PNG, JPEG, WebP or SVG, up to 256 KB.
  • A brand colour — a single hex value.
  • Company fields — name, email, phone, website, VAT/tax id, address. A flexible set; fill in only what you need.

Your logo is stored privately and inlined into your own renders only — there is no public URL and no file host. It's baked straight into the PDF you generate.

The placeholders

At render time we inject a brand object into your data, so each saved field resolves as {{ brand.<field> }}. This applies to the template path (inline templates and stored tpl_… ids) — raw html renders are left exactly as sent.

<!-- Every field you save resolves as {{brand.<field>}} -->
<img src="{{brand.logo}}" alt="{{brand.name}}" style="height:44px" />
<h2 style="color:{{brand.color}}">{{brand.name}}</h2>
<p>
  {{brand.email}} · {{brand.website}} · {{brand.phone}}<br />
  {{brand.address}} · VAT {{brand.vat}}
</p>

The logo is a data: URI, so put it straight in an <img src>{{ brand.logo }} is safe with the normal double-stache (the data URI has no characters that get escaped). If you haven't set a kit, every {{ brand.* }} simply renders empty.

A full template

Save this as a stored template (or send it inline). Your kit fills the {{ brand.* }} placeholders; your per-invoice data fills the rest.

<html>
  <body style="font-family:sans-serif;padding:40px;--brand:{{brand.color}}">
    <header style="display:flex;justify-content:space-between;align-items:center">
      <img src="{{brand.logo}}" alt="{{brand.name}}" style="height:44px" />
      <div style="text-align:right">
        <strong>{{brand.name}}</strong><br />
        {{brand.email}} · {{brand.website}}<br />
        VAT {{brand.vat}}
      </div>
    </header>
    <div style="height:6px;background:var(--brand);margin:24px 0"></div>
    <h1 style="color:var(--brand)">Invoice {{number}}</h1>
    <p>Bill to: {{billTo.name}}</p>
    <p>Total: {{total}}</p>
  </body>
</html>

Per-render override

The kit is the base. If a single render needs a different value — say a sub-brand or a one-off colour — pass a brand object in that call's data and it overrides the saved kit for that render only (field by field).

{
  "template": "tpl_8sJ2kQ...",
  "data": {
    "number": "INV-1024",
    "brand": { "name": "Globex Subsidiary", "color": "#0ea5e9" }
  }
}

Notes

  • One kit per account, owner-scoped — only your own renders see it.
  • template path only. Raw html renders are not merged, so {{ brand.* }} there is left literal — send template to use the kit.
  • Honest to the merge engine: {{ }} (escaped), {{{ }}} (raw) and dotted paths only — no loops. See Templates and Make it your brand.