UPC-E barcode in a PDF

Where the symbol comes from

This API renders HTML to PDF. It does not generate barcodes, so the UPC-E symbol itself is produced by an encoder in your own stack and placed in the markup, either as inline SVG or as a data URI. That split matters more than it sounds: the encoders are mature and correct, and almost every barcode that will not scan failed for a layout reason rather than an encoding one. Everything below is about the layout half.

What it can encode

Six digits are shown, but the symbol represents a full twelve digit UPC-A that happens to contain a compressible pattern of zeros. The number system digit must be 0 or 1. This is not a separate allocation: you cannot obtain a UPC-E number, you can only find that a UPC-A you already hold qualifies for compression, and most do not.

The check digit, and who computes it

Computed over the expanded twelve digit UPC-A, not over the six digits you can see, and then encoded in the parity of the six characters rather than as a character of its own. That has a practical consequence people find surprising: the symbol contains no bars that correspond to the check digit, and the six digits printed beneath it are not the number the scanner hands to the till.

Size and quiet zone

The two measurements that decide whether a scanner accepts the symbol, and the two most often lost when a design is adjusted to fit.

• X-dimension: 0.330mm at 100 percent magnification, giving a nominal symbol of 22.11 by 25.93mm. Magnification range 80 to 200 percent, the same as the rest of the retail family. Note the symbol is taller than it is wide at nominal size, which is the opposite proportion to EAN-8.
• Quiet zone: 9 times the X-dimension leading and 7 times trailing, so asymmetric, and asymmetric in different proportions from EAN-13. At 100 percent that is 2.97mm on the left and 2.31mm on the right. There is no version of this family where both margins are the same except EAN-8.

Where it is used

• small retail packs in North America, where UPC-A is the norm and will not fit
• single-serve food and beverage items
• cosmetics, batteries and blister-packed hardware
• anywhere a UPC-A already exists and the pattern of zeros happens to allow compression

Placing it in the markup

The quiet zone is padding on the container rather than part of the encoder's output, so it survives a change of encoder. Dimensions are in millimetres, because a bar width is a physical measurement and a percentage makes it depend on whatever the container happens to be.

<!-- Expansion is the scanner's job, not yours. Store the twelve
     digit UPC-A as your product's identity and let the encoder decide
     whether a UPC-E representation is even available. -->
<figure class="upce">
  <img src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0i..." alt="UPC-E 04252614">
</figure>

<style>
.upce {
  margin: 0;
  /* Asymmetric: 9X leading, 7X trailing, which at 100 percent is 2.97mm
     and 2.31mm. The leading side is the wider one. */
  padding: 0 2.31mm 0 2.97mm;
  background: #fff;
  width: max-content;
  print-color-adjust: exact;
  -webkit-print-color-adjust: exact;
}
.upce img {
  width: 22.11mm;
  height: 25.93mm;
  display: block;
}
</style>

What goes wrong on paper

Designing a pack around UPC-E before checking that the product's UPC-A can be compressed at all. Compression requires a specific arrangement of zeros in the manufacturer code and item number, and the majority of numbers do not have it. Confirm the encoder will produce a symbol for your actual number before the artwork is signed off, not after.

First thing to check when it will not scan

It usually is scanning, and the problem is that two scanners disagree about what to send. Many are configured to expand UPC-E to the full twelve digits before transmitting and others send the six shown, so the same symbol produces two different strings in two different lanes. Check the expansion setting before you change anything on the artwork.

Vector, not a bitmap

Encode to SVG wherever the encoder offers it. A rasterised barcode is resampled when the PDF is printed, and at 203 or 300 dots per inch the bar edges land between printer dots, so the ratio of bar to space drifts by a fraction of a millimetre. That fraction is the whole tolerance. An SVG stays vector inside the PDF and is rendered at the printer's own resolution, which removes the entire failure mode. Where a bitmap is unavoidable, generate it at the final physical size and set image-rendering so nothing smooths the edges.

Frequently asked

Other symbologies

Codes of the same kind, and one from each of the other kinds.