Blazor Barcode Example - QR Code with Logo
This demo passes automated axe checks with 0 violations — semantic markup, ARIA, full keyboard operation, visible focus. Section 508 conformant
Accessibility report
VPAT
Properties
This sample visualizes a QR Code with an embedded logo, combining the functionality of a machine-readable optical label with visual branding. The logo is displayed in the center of the QR code while maintaining full scannability.
This example demonstrates how to render a logo in the center of a QR Code. The ImageSource can be specified as an image path, base64-encoded image, online image URL, or icon.
Customize the QR barcode with the following options:
- Content: Modify the
Valueproperty to change the barcode content - Size: Adjust
WidthandHeightto control dimensions - Colors: Set
Background ColorandFore Color - Text Display: Use
Text Visibilityto show or hide text - Spacing: Configure
Marginproperties (left, right, top, bottom) - Version: Set the
Versionproperty to control QR code size - Error Correction: Configure the
ErrorCorrectionLevelproperty
Use the Download button to save the barcode as an image.