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:

Margins

default: 10

Set the space margin around the barcode. If nothing else is set, all side will inherit the margins property but can be replaced if you want to set them separably.

Examples:

JsBarcode("#barcode", "Bigger margins", {
  margin: 30,
  background: "#dddddd"
});

JsBarcode("#barcode", "Left/Top margin", {
  marginLeft: 30,
  marginTop: 50,
  background: "#dddddd"
});

Result: