01
ZPL editor
Edit ZPL with a language-aware Monaco workspace built for label source.
- Syntax highlighting and formatting
- Parameter-aware command help
- Source-linked diagnostics
^XA Free · open source · local-only
Free Online ZPL Editor, Viewer & Visual Designer
Take a label from raw Zebra Programming Language to a print-ready visual. Code, render, inspect, and arrange fields in one local workspace.
No sign-upNo label uploadsMIT licensed
- Language coverage
- 200+ commands recognized
- Runtime
- Node.js + browser
- Processing
- 100% local
Editor, viewer, and designer
One source / three surfaces
Three ways to work with one ZPL label
Start in source code, inspect the rendered result, or select fields directly on the label. Every view stays synchronized, so you can move quickly without losing the underlying ZPL.
02
ZPL viewer
Render a live black-and-white label preview without sending code to an external API.
- True label dimensions
- Barcode and QR rendering
- PNG export
03
ZPL designer
Work directly on supported fields while keeping the underlying ZPL synchronized.
- Drag, resize, and align
- Layers, guides, and properties
- Code and canvas selection sync
01 / Live ZPL preview
Write code. See the label—not a guess.
The online ZPL viewer renders a deterministic one-bit raster locally as you type. Source-linked diagnostics, command documentation, formatting, and safety limits help you find problems before a label reaches a print workflow.
- Live browser rendering with configurable print density
- ZPL validator diagnostics linked back to source
- Command catalog with parameter guidance
- Multiple labels, files, and workspace ZIPs
02 / Visual ZPL designer
Design on the label while keeping real ZPL underneath
Drag, resize, align, distribute, lock, hide, and reorder supported fields on a WYSIWYG canvas. Rulers, snapping, manual guides, layers, and property controls make precise label layout faster.
Start designing a ZPL label03 / Variable data and assets
One design, every record
Import CSV or JSON, bind columns to ^FN fields, preview each record, and turn ZPL into PNG batches. Images and fonts are managed in the same local workspace.
CSV and JSON records
Import structured data and map columns to numbered ZPL fields.
Images and fonts
Import workspace assets and manage their ZPL resource names.
Record preview
Step through live record values before producing a batch.
Flexible export
Save ZPL, PNG images, batch PNGs, or a complete workspace ZIP.
Private by architecture
Your ZPL never needs to leave the browser
ZPLr parses, renders, and edits labels on your device. Your ZPL and imported data never leave this browser for processing. There is no account, upload API, or server-side label processing.
No upload endpoint
Label source and imported datasets are processed by the browser application.
No account required
Open the editor and begin working without creating a profile.
Open implementation
Inspect the MIT-licensed code and integrate the same engine yourself.
04 / JavaScript and TypeScript ZPL library
One ZPL engine, two runtimes
Use ZPLr as a Node.js ZPL renderer in backend jobs or as a browser library for local previews. Both entries share the parser, diagnostics, command capabilities, and deterministic raster model.
- Typed ESM APIs for parsing and rendering ZPL
- Node canvas output through the optional skia-canvas peer
- HTMLCanvasElement and Blob output in modern browsers
- Reusable render sessions, structured diagnostics, and safety limits
zplr · zplr/node// "zplr/node" exposes the same Node.js API.
import { renderZplPNG } from "zplr";
import { writeFile } from "node:fs/promises";
const [png] = await renderZplPNG(source, {
printDensity: 8,
});
await writeFile("label.png", png);zplr/webimport { renderZpl } from "zplr/web";
const job = await renderZpl(source);
const canvas = job.labels[0].canvas;
document.querySelector("main")?.append(canvas);Built for real label work
From a first preview to an automated label pipeline
Shipping labels
Inspect addresses, tracking barcodes, routing blocks, and print dimensions.
Retail and inventory
Build UPC, EAN, Code 128, Data Matrix, QR, and item-label templates.
Template workflows
Bind CSV or JSON records to ^FN fields and preview every variation.
Application previews
Embed ZPL parsing and rendering in Node.js services or browser interfaces.
Frequently asked questions
About the ZPL editor and library
Need implementation details? The project documentation covers command support, diagnostics, limits, and runtime APIs.
What is a ZPL editor?
A ZPL editor helps you write and inspect Zebra Programming Language label source. ZPLr combines source editing, command guidance, diagnostics, live rendering, and visual field editing in one browser workspace.
Can I preview ZPL online without uploading my label?
Yes. ZPLr runs the parser and renderer locally in your browser, so the online ZPL viewer does not need to send your label source or imported data to a rendering server.
Is ZPLr also a visual ZPL label designer?
Yes. Supported fields can be selected, dragged, resized, aligned, reordered, locked, hidden, and edited through layers and property controls while the ZPL source stays synchronized.
Can I use ZPLr from Node.js or a browser application?
Yes. Import zplr or zplr/node for Node.js, and zplr/web for browser projects. Both entries expose typed parsing and rendering APIs built from the same engine.
Can the editor export ZPL labels as PNG files?
Yes. You can export the active label as PNG, generate PNGs for variable-data records, save the ZPL source, or download a workspace ZIP containing labels, datasets, and assets.
Which ZPL commands are supported?
ZPLr recognizes more than 200 commands across rendering, state, storage, control, and compatibility categories. The public command-support document records which commands are supported, partial, or recognized without rendered output.
Ready when you are
Your next ZPL label can start here
Open the editor with a working shipping-label example, then change the code, move fields visually, or connect variable data.
Open the free ZPL editor