Barcode Generator

A barcode is a machine-readable representation of data in a visual, scannable format. It encodes information — numbers, letters, or special characters — as a series of parallel bars and spaces of varying widths. Barcode scanners read these patterns by measuring the transitions between dark bars and light gaps, translating them back into the original data.

Barcodes are foundational to modern logistics, retail, healthcare, and manufacturing. Every product on a supermarket shelf, every parcel in a shipping warehouse, and every patient wristband in a hospital carries a barcode that uniquely identifies it. Because the data is machine-readable rather than human-readable, barcodes dramatically reduce manual entry errors and accelerate data capture at scale.

This barcode generator tool lets you create a Code 128 barcode from any alphanumeric input, customise the bar width (1–4 px) and overall height (50–200 px), toggle a human-readable text label below the bars, and download the result as a PNG image — all directly in your browser with no server calls and no software to install.

The generator follows the Code 128 standard, one of the most versatile linear barcode symbologies in widespread use. Each character is encoded as an 11-bit binary pattern, where 1 represents a black bar and 0 represents a white space. The full barcode pattern is assembled by concatenating three components:

1. Start symbol — a fixed 11-bit pattern (11010010000) that signals the beginning of a Code 128 barcode and identifies which character set is in use (Code Set B for this tool).
2. Data symbols — one 11-bit pattern per input character, drawn from a lookup table of 43 supported characters (digits 0–9, uppercase A–Z, space, hyphen, and period).
3. Stop symbol — a fixed 13-bit termination pattern (1100011101011) that signals the scanner to stop reading.

Once the full bit string is assembled, the tool renders it onto an HTML5 Canvas element. Each bit position advances the x-coordinate by the chosen bar width. A 1 bit causes a filled rectangle of width × height pixels to be drawn; a 0 bit is left blank (white). The canvas is padded by 20 px on each side to ensure scanners can detect the quiet zone, giving a total canvas width of patternLength × barWidth + 40 pixels.

The tool offers four barcode format options in its interface. Understanding the purpose of each helps you choose the right one for your use case:

The core barcode pattern rendered on the canvas is always derived from the Code 128 Code Set B lookup table, which covers uppercase letters A–Z, digits 0–9, space, hyphen, and period. Input characters that fall outside this set are silently skipped during pattern assembly, so ensure your input uses only supported characters for accurate results.

Two sliders control the physical dimensions of the generated barcode image.

Bar Width (1–4 px): This setting determines how many pixels wide each individual bar module is. A module is the narrowest element in the barcode — every bar and space in the pattern is a whole-number multiple of this base unit. Wider modules produce a larger, more print-friendly barcode that scanners at longer distances can read more reliably. Narrower modules compress more data into less horizontal space but require a higher-resolution scanner and more precise printing.

Height (50–200 px): Barcode height does not carry data; it is a scanning aid. Taller barcodes allow scanners to read the code even if the beam passes at an angle or if part of the barcode is damaged or obscured. Industry standards like GS1 recommend a minimum height-to-width ratio for reliable scanning in production environments. For web or preview use, a height of 80–120 px with a bar width of 2 px is typically sufficient.

Show text label: When enabled, the plain-text value of your input is printed below the bars in a 14 px monospace font, centred on the canvas. This adds 30 px to the total canvas height. Human-readable text helps people verify the encoded value without a scanner and is required by some labelling standards.

Barcodes generated with this tool are suitable for prototyping, internal labelling, educational demonstrations, and low-volume inventory systems. Here are practical scenarios and guidance for each:

• Inventory tagging: Encode a short SKU or asset number (e.g., SKU-0042) and print at 2–3 px bar width, 120 px height. Attach to shelves, boxes, or equipment.
• Event check-in: Encode an attendee ID or ticket number. Scan with any Code 128–capable mobile app at the door.
• Library or document management: Assign barcode IDs to folders or files. A spreadsheet scanner can populate a database row per scan.
• Classroom demonstrations: Show students how character patterns map to bars. Decode by eye using the Code 128 pattern table.
• Prototyping retail labels: Mock up product labels for UI/UX design reviews or client presentations before commissioning a certified GS1 barcode.

For production retail use (products sold in stores), you need a GS1-registered barcode with a certified check digit. EAN-13 and UPC-A require the last digit to be a computed check digit derived from the preceding digits using a weighted modulo-10 algorithm. This generator's UI offers EAN-13 and UPC-A as format labels, but always validate your output with a reference decoder before printing labels for commercial distribution.

When downloading the PNG, print at 300 DPI or higher for physical labels. If you are generating barcodes programmatically at scale, a dedicated library such as JsBarcode or bwip-js implements full GS1 compliance including check-digit verification and quiet-zone enforcement.