The document collection / Invoice

Editorial Invoice Template

A warm paper invoice with an amber spine, clear line items, payment terms, and bank details. A considered billing layout for creative studios, consultants, and independent professionals.

Paper format: A4
Included: HTML layout + sample JSON
Customization: Content, colors, typography
Rendering: Handlebars + Chromium

Use this template Download HTML

Preview the sample document, then make it yours. Change the layout in your editor or clone it into your RelayPDF dashboard to create an editable draft.

Open full-size preview

RELAYPDF / DOCUMENT COLLECTION

A4 HTML → PDF

Make it work for you

From a sample to
your next document.

This layout uses standard HTML and CSS with Handlebars fields. The preview is rendered from the downloadable source and sample data shown below.

Use the sample as a starting point. Your application supplies dates, labels, and calculated amounts; the template handles their presentation.

Personalize the design
Update the organization name, typography, and CSS accent colors. Replace the sample wording with content appropriate to your business.
Connect your data
Keep the field structure in the sample JSON and replace its values. Repeating arrays create the document’s rows or sections.
Preview, publish, generate
Test with your longest content. Publish the draft, then generate PDFs using its templateId and fresh templateData.

What you can customize

Field	Purpose
`number`	Your document reference; use a stable, unique identifier.
`issuedOn`	Date supplied by your application; ISO dates work with the template’s date formatter.
`dueOn`	Date supplied by your application; ISO dates work with the template’s date formatter.
`currency`	ISO currency code used by the money formatter, such as USD.
`taxRate`	Editable document content. Replace the sample value with your own data.
`subtotal`	Pre-tax amount calculated by your application.
`tax`	Tax amount supplied by your billing system.
`total`	Final amount calculated by your application, including applicable adjustments.
`notes`	Additional context or instructions shown with the document.
`company`	Your business identity and contact details.
`customer`	The recipient’s billing identity and address.
`items`	Repeatable line items; each object becomes a row.
`payment`	Payment terms, bank information, and optional payment link or QR image.

Start with real sample data

Download sample JSON ↓

Inspect sample JSON

templateData / JSON

{
  "number": "FK-2208",
  "issuedOn": "2026-08-21",
  "dueOn": "2026-09-11",
  "currency": "USD",
  "taxRate": "8%",
  "subtotal": 2860,
  "tax": 228.8,
  "total": 3088.8,
  "notes": "Vessel series is numbered 01–06. Crate remains gallery property after the hang. Please reference FK-2208 on the transfer.",
  "company": {
    "name": "Field & Kiln",
    "cityLine": "Hudson · Ceramics & object",
    "email": "studio@fieldandkiln.studio",
    "address": "11 Court Street, Hudson, NY 12534",
    "phone": "+1 518 555 0194",
    "taxId": "47-2018831",
    "website": "fieldandkiln.studio"
  },
  "customer": {
    "name": "Westmere Gallery",
    "attn": "Nora Ellison, Director",
    "address": "19 Crosby Street, New York, NY 10013",
    "email": "accounts@westmere.gallery"
  },
  "items": [
    {
      "description": "Harbor vessel series, six pieces",
      "detail": "Stoneware, ash glaze, numbered 01–06",
      "quantity": 6,
      "unitPrice": 320,
      "amount": 1920
    },
    {
      "description": "Reduction firing, two loads",
      "detail": "Cone 10 gas kiln, shared shelf",
      "quantity": 2,
      "unitPrice": 280,
      "amount": 560
    },
    {
      "description": "Crate, freight, and hang",
      "detail": "White-glove to Crosby Street",
      "quantity": 1,
      "unitPrice": 380,
      "amount": 380
    }
  ],
  "payment": {
    "terms": "Net 21",
    "bank": "Hudson River Bank",
    "account": "8821-044",
    "routing": "021300077",
    "url": "https://pay.fieldandkiln.studio/FK-2208",
    "qrImage": "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 120'%3E%3Crect width='120' height='120' fill='white'/%3E%3Cg fill='black'%3E%3Crect x='6' y='6' width='34' height='34'/%3E%3Crect x='14' y='14' width='18' height='18' fill='white'/%3E%3Crect x='80' y='6' width='34' height='34'/%3E%3Crect x='88' y='14' width='18' height='18' fill='white'/%3E%3Crect x='6' y='80' width='34' height='34'/%3E%3Crect x='14' y='88' width='18' height='18' fill='white'/%3E%3Crect x='48' y='52' width='8' height='8'/%3E%3Crect x='62' y='52' width='8' height='8'/%3E%3Crect x='76' y='52' width='8' height='8'/%3E%3Crect x='48' y='66' width='8' height='8'/%3E%3Crect x='62' y='66' width='8' height='8'/%3E%3Crect x='76' y='66' width='8' height='8'/%3E%3Crect x='48' y='80' width='8' height='8'/%3E%3Crect x='62' y='80' width='8' height='8'/%3E%3Crect x='76' y='80' width='8' height='8'/%3E%3C/g%3E%3C/svg%3E"
  }
}

Clone through the API

POST /v1/templates

curl https://api.relaypdf.com/v1/templates \
  -H "Authorization: Bearer $RELAYPDF_API_KEY" \
  -H "Content-Type: application/json" \
  -d '{"name":"Editorial Invoice Template","galleryId":"amber-spine-folio-invoice"}'

This creates an account-owned draft. Publish it before using its slug or UUID as templateId with templateData on POST /v1/pdf. Follow the complete template workflow →

Will the PDF match this preview?

The preview uses the same HTML and sample data included with this template. RelayPDF renders HTML using Chromium. Use the document’s intended A4 paper size and enable print backgrounds. Review page breaks when you add longer content or more rows.

Can I use my own branding and data?

Yes. Edit the HTML and CSS, replace the sample values, and keep the field names your template expects. Save your customized draft in the dashboard and publish a version when it is ready for your application.