imitation
Barcode
A scannable Code 128 barcode as SVG, with the value shown underneath.
Invoice referenceCode 128, value printed below
In context
Invoice slipThe barcode on a printable supplier invoice
Invoice INV-1042
Northern Print Co.
DueDepot signage, 23 Oct. Total £3,860.50.
Props
| Prop | Type | Required | Default |
|---|---|---|---|
value | string | Yes | — |
barWidth | number | undefined | No | 2 |
height | number | undefined | No | 60 |
color | string | undefined | No | #000000 |
bgColor | string | undefined | No | #ffffff |
showText | boolean | undefined | No | true |
quietZone | number | undefined | No | 10 |
Width
A real Code 128 barcode. barWidth sets the narrowest bar in px and the total width scales with the value, as a scanner needs; quietZone adds the blank margin around it.
data-rebar-* attributes
data-rebar-component="barcode" on the root <svg>; each bar is data-rebar-part="bar", the text (with showText) is data-rebar-part="text".
Migrating to Ant Design
AntD ships no barcode component; use jsbarcode or react-barcode, or keep this encoder and swap the shell.