Barcodes & QR Codes in PDF Templates
You can add barcodes and QR codes to your templates to generate scannable codes in your PDFs. Both support dynamic variables, so each generated PDF can have a unique code.
Barcodes
Section titled “Barcodes”Barcodes encode text or numbers as a series of vertical lines. Use them for tracking numbers, product codes, SKUs, or any identifier that needs to be machine-readable.
To add a barcode, select a container in the Layers panel, click + New Element, and choose Barcode.
Setting the value
Section titled “Setting the value”In the right panel, enter the value to encode in the Content field. You can type a static value or use a variable like {{tracking_number}}.
Barcode formats
Section titled “Barcode formats”Choose the format that matches your use case:
| Format | Use case | Value format |
|---|---|---|
| Code 128 | General purpose — letters, numbers, symbols | ABC-123456 |
| Code 39 | Industrial — uppercase letters and numbers only | SHIP12345 |
| EAN-13 | Retail products — exactly 13 digits | 5901234123457 |
| EAN-8 | Small product packaging — exactly 8 digits | 96385074 |
| ITF-14 | Shipping cartons — exactly 14 digits | 15400141288763 |
Code 128 is the most flexible and works for most situations.
Customization
Section titled “Customization”- Line color — Color of the bars (default is black)
- Size — Drag the handles to resize the barcode on the canvas
QR Codes
Section titled “QR Codes”QR codes encode data in a 2D square pattern. They can hold more information than barcodes and are easily scanned with a phone camera. Use them for URLs, payment links, ticket verification, or any data you want to make quickly accessible.
To add a QR code, select a container, click + New Element, and choose QR Code.
Setting the value
Section titled “Setting the value”Enter the data to encode in the Content field of the right panel. This can be a URL, plain text, or a variable like {{payment_url}}.
Customization
Section titled “Customization”- Foreground — Color of the dark squares (default: dark gray
#111827) - Background — Color of the light squares (default: white)
- Error Correction — How much of the code can be damaged and still scan:
| Level | Recovery | When to use |
|---|---|---|
| L (Low) | ~7% | Clean environments, maximum data capacity |
| M (Medium) | ~15% | General purpose — good default |
| Q (Quartile) | ~25% | Documents that may be folded or slightly worn |
| H (High) | ~30% | Harsh conditions, or if you plan to place a logo over the QR code |
Sizing
Section titled “Sizing”QR codes should be at least 2cm × 2cm for reliable scanning. If the code encodes a long URL, it becomes more dense — in that case, make it larger so scanners can read it comfortably.
Dynamic codes
Section titled “Dynamic codes”Both barcodes and QR codes work with template variables. Set the Content field to a variable like {{tracking_number}} or {{payment_url}}, then pass the actual value through the API. Each generated PDF gets its own unique code.
This is commonly used for:
- Shipping labels — Barcode with the tracking number, QR code linking to the tracking page
- Invoices — QR code with the payment link
- Event tickets — QR code with a unique ticket ID for scanning at entry
- Product labels — Barcode with the SKU, QR code linking to the product page
- Certificates — QR code with a verification URL to confirm authenticity
Next steps
Section titled “Next steps”- Data Binding — How to pass dynamic values to your templates
- Components — Overview of all element types
- Styling — Customize the appearance of your elements