# Barcode

Source: https://lumeo.nativ.sh/components/barcode

# Barcode

Renders a 1D Code 128B barcode as inline SVG. Suitable for product labels, order numbers, and any ASCII printable data.

## When to Use

-   Display a scannable 1D barcode for inventory, shipping, or order reference numbers.
-   Embed barcodes in printable reports or labels without external dependencies.
-   Use alongside [QRCode](/components/qr-code) when 2D scanning is not available.

Preview Code

Default (Code 128B)

Copy Code

Preview Code

Numeric Data

Copy Code

Preview Code

No Text

Copy Code

Preview Code

Custom Height

Copy Code

Preview Code

Custom Bar Width

Copy Code

Preview Code

Interactive: Height & Bar Width

Height: 80 px

BarWidth: 2

Adjust height and bar width to preview the barcode at different sizes.

Copy Code

### Implementation Note

This component implements a real **Code 128B** encoder in C# (Code Set B, ASCII 32–126). Barcodes rendered by this component are scannable by standard 1D barcode readers. Only printable ASCII characters (space through tilde) are supported; characters outside this range will cause the barcode to render blank.

## API Reference

### Barcode

Property

Type

Default

Description

Value

string

""

Data to encode. Supports ASCII 32–126 (printable characters).

Format

BarcodeFormat

Code128

Barcode format. Currently Code128 (Code Set B) is fully encoded; Code39 and EAN13 are reserved for future use.

Height

int

80

Bar height in pixels.

BarWidth

double

2

Width per narrow module in pixels. Increase for larger barcodes.

ShowText

bool

true

Render the value as text below the bars.

Color

string

"foreground"

Theme token for the bar color.

BackgroundColor

string

"background"

Theme token for the background fill.

## Related Components

-   [QRCode](/components/qr-code) — 2D QR barcode with error correction and optional centre image.