npx skills add ...
npx skills add syncfusion/blazor-ui-components-skills --skill syncfusion-blazor-barcode
Build and troubleshoot barcode generation in Blazor using SfBarcodeGenerator, SfQRCodeGenerator, SfDataMatrixGenerator, and SfDotCodeGenerator. Trigger for 1D barcodes (Code39, Code128, Codabar), QR codes with logo and error correction, Data Matrix, DotCode, GS1-compliant symbologies (GS1 Code 128, ITF-14, GS1 DataBar family, GS1 QR Code, GS1 Data Matrix, GS1 DotCode) for retail/logistics/inventory traceability, checksum validation, and exporting barcodes to images in Syncfusion Blazor apps.
npx skills add syncfusion/blazor-ui-components-skills --skill syncfusion-blazor-barcode
Syncfusion's Blazor Barcode Generator package (Syncfusion.Blazor.BarcodeGenerator) provides four components for generating barcodes in Blazor applications:
| Component | Use For |
|---|---|
SfBarcodeGenerator | 1D linear barcodes (Code39, Code128, Codabar, etc.) plus GS1 Code 128, ITF-14, and the full GS1 DataBar family |
SfQRCodeGenerator | QR codes with optional logo embedding, plus GS1 QR Code (EnableGS1) |
SfDataMatrixGenerator | 2D Data Matrix codes for compact encoding, plus GS1 Data Matrix (EnableGS1) |
SfDotCodeGenerator | High-density dot-matrix DotCode symbols, plus GS1 DotCode (EnableGS1) |
All four work in Blazor Server, Blazor WebAssembly, and Blazor Web App (.NET 8+).
SfBarcodeGenerator, SfQRCodeGenerator, SfDataMatrixGenerator, or SfDotCodeGeneratorEnableGS1, or GTIN/SSCC check-digit calculation๐ Read: references/getting-started.md
_Imports.razor namespace configurationProgram.cs๐ Read: references/barcode-types.md
BarcodeType enum values with descriptionsEnableCheckSum configurationOnValidationFailed event handling๐ Read: references/qr-code-generator.md
OnValidationFailed event๐ Read: references/data-matrix-generator.md
OnValidationFailed event๐ Read: references/dotcode-generator.md
SfDotCodeGenerator usageEnableGS1 for pharmaceutical/healthcare serializationOnValidationFailed event and error causes๐ Read: references/gs1-barcodes.md
BarcodeType.GS1Code128) for shipping/batch/expiry labelsBarcodeType.ITF14) for carton/case-level GTIN trackingEnableGS1๐ Read: references/export-and-customization.md
ForeColor for custom barcode colorWidth / Height for sizingBarcodeGeneratorDisplayText for label text| Property | Applies To | Description |
|---|---|---|
Value | All | The data string to encode |
Width | All | Width of the barcode (px or %) |
Height | All | Height of the barcode (px or %) |
Type | SfBarcodeGenerator | BarcodeType enum โ selects the 1D symbology, including GS1Code128, ITF14, and the GS1 DataBar variants |
ForeColor | All | Color of the barcode bars (e.g., "red", "#333") |
EnableCheckSum | SfBarcodeGenerator | Adds/validates checksum digit (default true for Code39) |
ErrorCorrectionLevel | SfQRCodeGenerator | QR error recovery: Low, Medium, Quartile, High |
EnableGS1 | SfQRCodeGenerator, SfDataMatrixGenerator, SfDotCodeGenerator | Switches the component into GS1 mode, encoding Value as (AI)data pairs with FNC1 handling |
OnValidationFailed | All | Event triggered when Value contains invalid characters, malformed AI syntax, or an invalid check digit |
| Need | Component | Read |
|---|---|---|
| Product/inventory labels | SfBarcodeGenerator (Code128/Code39) | barcode-types.md |
| URL / contact / 2FA QR code | SfQRCodeGenerator | qr-code-generator.md |
| Branded QR code with logo | SfQRCodeGenerator + QRCodeLogo | qr-code-generator.md |
| Pharmaceutical / shipping labels | SfDataMatrixGenerator | data-matrix-generator.md |
| Industrial/inkjet product serialization | SfDotCodeGenerator | dotcode-generator.md |
| Shipping/batch/expiry label (GS1) | SfBarcodeGenerator (GS1Code128) | gs1-barcodes.md |
| Carton/case GTIN tracking | SfBarcodeGenerator (ITF14) | gs1-barcodes.md |
| Retail POS omnidirectional scan | SfBarcodeGenerator (GS1DataBarOmnidirectional) | gs1-barcodes.md |
| Small package / limited space GTIN | SfBarcodeGenerator (GS1DataBarStacked/GS1DataBarLimited) | gs1-barcodes.md |
| Variable-measure item or coupon (multi-AI) | SfBarcodeGenerator (GS1DataBarExpanded/ExpandedStacked) | gs1-barcodes.md |
| Supply chain / product traceability QR | SfQRCodeGenerator + EnableGS1 | gs1-barcodes.md |
| Compact GS1 label (pharma/manufacturing) | SfDataMatrixGenerator + EnableGS1 | gs1-barcodes.md |
| GS1 serialization on industrial printers | SfDotCodeGenerator + EnableGS1 | dotcode-generator.md / gs1-barcodes.md |
| Download barcode as image | .Export() method | export-and-customization.md |
| Embed barcode in email/PDF | .ExportAsBase64Image() | export-and-customization.md |
@using Syncfusion.Blazor.BarcodeGenerator
<SfQRCodeGenerator Width="200px" Height="200px"
Value="https://www.syncfusion.com">
</SfQRCodeGenerator>@using Syncfusion.Blazor.BarcodeGenerator
<SfDataMatrixGenerator Width="200" Height="150"
Value="SYNCFUSION">
</SfDataMatrixGenerator>@using Syncfusion.Blazor.BarcodeGenerator
<SfDotCodeGenerator Width="300" Height="250"
Value="Product Serialization">
</SfDotCodeGenerator>@using Syncfusion.Blazor.BarcodeGenerator
<SfBarcodeGenerator Width="300px" Height="200px"
Type="@BarcodeType.GS1Code128"
Value="(01)09506000134352(17)261231(10)ABC123">
<BarcodeGeneratorDisplayText Text="Product Serialization" />
</SfBarcodeGenerator>@using Syncfusion.Blazor.BarcodeGenerator
<SfQRCodeGenerator Width="250px" Height="250px"
Value="(01)09506000134352(17)271231(10)ABC123"
EnableGS1="true">
</SfQRCodeGenerator>