Options

Width (default: 2)

The width option is the width of a single bar.

Examples:

JsBarcode("#barcode", "Smallest width", {
  width: 1
});

JsBarcode("#barcode", "Wider barcode", {
  width: 3
});

Result:

Height (default: 100)

The height of the barcode.

Examples:

JsBarcode("#barcode", "Wider barcode", {
  height: 150
});

JsBarcode("#barcode", "Smallest width", {
  height: 25
});

Result:

Format (default: "auto" (CODE128))

Select which barcode type to use. Please check the wikipage of the different barcode types for more information.

Examples:

JsBarcode("#barcode", "123456789012", {
  format: "EAN13"
});

JsBarcode("#barcode", "123456789012", {
  format: "CODE39"
});

Result:

Font Options (default: "")

With fontOptions you can add bold or italic text to the barcode.

Examples:

JsBarcode("#barcode", "Bold text", {
  fontOptions: "bold"
});

JsBarcode("#barcode", "Italic text", {
  fontOptions: "italic"
});

JsBarcode("#barcode", "Both options", {
  fontOptions: "bold italic"
});

Result:

Font (default: "monospace")

Define the font used for the text in the generated barcode. This can be any default font or a font defined by a @font-face rule.

Examples:

JsBarcode("#barcode", "Fantasy font", {
  font: "fantasy"
});

Result:

Text Align (default: "center")

Set the horizontal alignment of the text. Can be left / center / right.

Examples:

JsBarcode("#barcode", "Left text", {
  textAlign: "left"
});

Result:

Text Position (default: "bottom")

Set the vertical position of the text. Can be bottom / top.

Examples:

JsBarcode("#barcode", "Top text", {
  textPosition: "top"
});

Result:

Text Margin (default: 2)

Set the space between the barcode and the text.

Examples:

JsBarcode("#barcode", "Text margin", {
  textMargin: 25
});

Result:

Font Size (default: 20)

Set the size of the text.

Examples:

JsBarcode("#barcode", "Bigger text", {
  fontSize: 40
});

Result:

Background (default: "#ffffff")

Set the background of the barcode.

Examples:

JsBarcode("#barcode", "Blue background", {
  background: "#ccffff"
});

Result:

Line Color (default: "#000000")

Set the color of the bars and the text.

Examples:

JsBarcode("#barcode", "Red lines", {
  lineColor: "#990000"
});

Result: