Document Stack
Document Stack
Docs

Building an Event Ticket Template

Design an event ticket template with QR codes, seat details, and eye-catching visuals.

Overview

Event tickets combine visual appeal with essential information: event name, date, venue, seat assignment, and a scannable QR code for entry. This guide walks through building one.

Page Setup

  • Size: Custom — 600 × 250px (landscape ticket shape)
  • Orientation: Landscape
  • Margins: 15px all sides
  • Background: Use a gradient or brand color

Multiple Tickets Per Page

For printing multiple tickets on A4 paper, design each ticket at 595 × 200px and stack 4 per page using multi-page templates.

Layout Structure

Divide the ticket into two zones:

  • Main area (left 70%) — Event details and attendee info
  • Tear-off stub (right 30%) — QR code and ticket number

Separate the zones with a vertical dashed line element.

Main Area Fields

Field KeyStyleExample
eventName20px bold, whiteTech Summit 2025
eventDate12px, whiteMarch 15, 2025
eventTime12px, white7:00 PM
venue11px, light grayMoscone Center, SF
attendeeName14px boldAlice Johnson
section11pxSection A
row11pxRow 12
seat14px boldSeat 5

Tear-Off Stub

  • qrCodeImage — Dynamic QR code image (100 × 100px)
  • ticketNumber — Monospace, 9px
  • ticketType — VIP, General, Student, etc.

Design Tips

  • Use a dark background with white text for visual impact
  • Add a subtle background image related to the event theme
  • Make the event name the largest element
  • Ensure the QR code has adequate contrast and padding for scanning
  • Use icon elements for calendar, clock, and location markers

Sample API Data

Generate Request Data
{
  "templateId": "tmpl_event_ticket",
  "data": {
    "eventName": "Tech Summit 2025",
    "eventDate": "March 15, 2025",
    "eventTime": "7:00 PM",
    "venue": "Moscone Center, San Francisco",
    "attendeeName": "Alice Johnson",
    "section": "Section A",
    "row": "Row 12",
    "seat": "Seat 5",
    "ticketNumber": "TKT-2025-00042",
    "ticketType": "VIP",
    "qrCodeImage": "https://example.com/qr/TKT-2025-00042.png"
  }
}

Next Steps