
syncfusion-aspnetcore-barcodes
Implement Syncfusion ASP.NET Core Barcode components including BarcodeGenerator (1D codes like Code39, Code128, Codabar), QR Code Generator, and DataMatrix Generator. Use this when rendering barcodes, implementing QR codes with logo embedding, or generating DataMatrix codes. This skill covers barcode type selection, color and dimension customization, display text configuration, and export functionality (JPG, PNG, Base64).
- Installs
- 96
- Last 24h
- —
- Trending rank
- —
- Security
- Not audited
Install
Works with every agent the skills CLI supports.
npx skills add https://github.com/syncfusion/aspnetcore-ui-components-skills --skill syncfusion-aspnetcore-barcodes- 01
Install
Run the command in your project. The CLI asks which agents to install for.
- 02
Describe the task
Ask your agent for something this skill covers. It loads syncfusion-aspnetcore-barcodes automatically when relevant.
- 03
Review the result
The agent follows the SKILL.md steps, scripts and references bundled with the skill.
SKILL.md
The instructions your agent reads when the skill is triggered.
⚠️ STRICT USAGE RULES — MANDATORY FOR ALL CODE GENERATION
These rules are non-negotiable. They must be followed for every code generation request using this skill.
Rule A — Use Only Provided Reference Files
- You must always read
references/getting-started.mdfor every request - Read other reference files only if they directly match the user's query:
barcode-types.md→ 1D linear barcodes (Code39, Code128, Codabar, etc.)qr-code.md→ QR codes with optional logo embeddingdata-matrix.md→ DataMatrix barcodescustomization.md→ color, size, display text propertiesexport.md→ PNG/JPG/Base64 export functionality
- No external knowledge is allowed:
- ❌ Do NOT use internet documentation
- ❌ Do NOT use training-data assumptions
- ✅ If a feature cannot be confirmed from reference files, apply Rule B
Rule B — No Guessing, No Inference
If a feature, property, API, or behavior is not explicitly documented in the reference files:
You must NOT:
- Invent properties or methods
- Infer missing APIs or parameters
- Assume deprecated or undocumented features exist
- Generalize from other Syncfusion components
Instead, respond with:
⚠️ NOT DOCUMENTED: [feature name] is not covered in the reference files.
Skipping this feature to avoid generating incorrect code.
Barcode Components Overview
Syncfusion EJ2 ASP.NET Core provides three barcode components via tag helpers:
| Component | Tag Helper | Best For | Key Properties |
|---|---|---|---|
| BarcodeGenerator | <ejs-barcodegenerator> | Linear 1D barcodes (Code39, Code128, Codabar, etc.) | type, value, foreColor, width, height |
| QR Code Generator | <ejs-qrcodegenerator> | 2D QR codes, URLs, large payloads | value, width, height, foreColor, logoUrl |
| DataMatrix Generator | <ejs-datamatrixgenerator> | 2D labels, print media, compact storage | value, width, height, foreColor |
All three support:
- ✅ Custom colors (
foreColor) - ✅ Dimension control (
width,height) - ✅ Display text customization
- ✅ Export to PNG/JPG/Base64
Navigation Guide
Always read references/getting-started.md first, then read only files relevant to the request.
| Reference File | Read When the Query Involves |
|---|---|
| 📄 getting-started.md | Every request — NuGet setup, tag helper registration, CDN, script manager |
| 📄 barcode-types.md | 1D barcodes, Code39, Code128, Codabar, Code11, Code32, Code93, barcode selection guidance |
| 📄 qr-code.md | QR code rendering, logo embedding, error correction, versioning (v1–v40) |
| 📄 data-matrix.md | DataMatrix overview, rendering, use cases |
| 📄 customization.md | Color (foreColor), dimensions (width/height), display text, rendering mode |
| 📄 export.md | Image export (PNG/JPG), Base64 export, export methods |
Quick Start
1. Install NuGet Package
Install-Package Syncfusion.EJ2.AspNet.Core
2. Register Tag Helper (~/Pages/_ViewImports.cshtml)
@addTagHelper *, Syncfusion.EJ2
3. Add CDN Resources (~/Pages/Shared/_Layout.cshtml)
<head>
<link rel="stylesheet" href="https://cdn.syncfusion.com/ej2/{{ site.ej2version }}/fluent.css" />
<script src="https://cdn.syncfusion.com/ej2/{{ site.ej2version }}/dist/ej2.min.js"></script>
</head>
<body>
...
<ejs-scripts></ejs-scripts>
</body>
4. Basic Examples
BarcodeGenerator (Code128)
<ejs-barcodegenerator id="barcode"
width="200px"
height="150px"
type="Code128"
value="SYNCFUSION"
mode="SVG">
</ejs-barcodegenerator>
QR Code
<ejs-qrcodegenerator id="qrcode"
width="200px"
height="200px"
value="https://syncfusion.com"
mode="SVG">
</ejs-qrcodegenerator>
DataMatrix
<ejs-datamatrixgenerator id="datamatrix"
width="200px"
height="150px"
value="Syncfusion"
mode="SVG">
</ejs-datamatrixgenerator>
Common Patterns
Choose Barcode Type by Content
| Use Case | Recommended Type | Reason |
|---|---|---|
| Numeric only, short data | Codabar or Code11 | Compact, simple |
| Alphanumeric, uppercase | Code39 | Industry standard for labels |
| Full ASCII, variable length | Code128 | Most versatile, widely supported |
| Pharmaceutical (Italian) | Code32 | Specialized regulatory requirement |
| Dense alphanumeric data | Code93 | Better compression than Code39 |
| URL or large payload | QR Code | Handles complex data, scannable by phones |
| Label/print media with compact storage | DataMatrix | Industry standard for logistics |
Customize Colors (All Generators)
<ejs-barcodegenerator id="barcode"
width="200px" height="150px"
type="Code128" value="SYNCFUSION"
foreColor="red" mode="SVG">
</ejs-barcodegenerator>
Embed Logo in QR Code
<ejs-qrcodegenerator id="qrcode"
width="200px" height="200px"
value="https://syncfusion.com"
logoUrl="logo.png"
mode="SVG">
</ejs-qrcodegenerator>
Export Barcode on Button Click
<button onclick="exportBarcode()">Export as JPG</button>
<script>
function exportBarcode() {
var barcode = document.getElementById("barcode").ej2_instances[0];
barcode.exportImage('MyBarcode', 'JPG');
}
function exportAsBase64() {
var barcode = document.getElementById("barcode").ej2_instances[0];
var base64String = barcode.exportAsBase64Image('PNG');
console.log(base64String);
}
</script>
Hide Display Text
<ejs-barcodegenerator id="barcode"
width="200px" height="150px"
type="Code128" value="SYNCFUSION"
displayText.visibility="false"
mode="SVG">
</ejs-barcodegenerator>
When to Use This Skill
✅ Rendering any barcode type in ASP.NET Core
✅ Choosing between BarcodeGenerator, QR Code, and DataMatrix
✅ Customizing barcode appearance (color, size, text)
✅ Embedding a logo in a QR code
✅ Exporting barcodes as images or Base64 strings
✅ Selecting appropriate barcode type for use case
FAQ
What does the syncfusion-aspnetcore-barcodes skill do?
Implement Syncfusion ASP.NET Core Barcode components including BarcodeGenerator (1D codes like Code39, Code128, Codabar), QR Code Generator, and DataMatrix Generator. Use this when rendering barcodes, implementing QR codes with logo embedding, or generating DataMatrix codes. This skill covers barcode type selection, color and dimension customization, display text configuration, and export functionality (JPG, PNG, Base64).
How do I install syncfusion-aspnetcore-barcodes?
Run npx skills add https://github.com/syncfusion/aspnetcore-ui-components-skills --skill syncfusion-aspnetcore-barcodes in your project. The skills CLI detects the agents you use and copies the skill into the right folder. For Claude Code you can also place the skill folder at ~/.claude/skills/syncfusion-aspnetcore-barcodes/ (personal) or .claude/skills/syncfusion-aspnetcore-barcodes/ (project).
Which AI agents can use syncfusion-aspnetcore-barcodes?
Any agent that supports the open Agent Skills format (a folder with a SKILL.md file), including Claude Code, Codex, Cursor, GitHub Copilot, Gemini CLI, Windsurf, Cline, OpenCode and more.
Is syncfusion-aspnetcore-barcodes safe to install?
No partner security audit is available yet. Skills can run commands and scripts, so read the SKILL.md and any bundled files before installing.
Who maintains syncfusion-aspnetcore-barcodes?
It is published by syncfusion in syncfusion/aspnetcore-ui-components-skills. It has 96 recorded installs.
More from syncfusion/aspnetcore-ui-components-skills
syncfusion-aspnetcore-charts
syncfusion/aspnetcore-ui-components-skills
Open the skill to read its SKILL.md instructions.
syncfusion-aspnetcore-common
syncfusion/aspnetcore-ui-components-skills
CONFIGURATION GUIDE — Assist with Syncfusion ASP.NET Core EJ2 components setup, localization, and version compatibility. Use when: installing Syncfusion packages, configuring globalization/localization, selecting compatible versions.
syncfusion-aspnetcore-license
syncfusion/aspnetcore-ui-components-skills
Open the skill to read its SKILL.md instructions.
syncfusion-aspnetcore-grid
syncfusion/aspnetcore-ui-components-skills
Open the skill to read its SKILL.md instructions.
syncfusion-aspnetcore-gantt-chart
syncfusion/aspnetcore-ui-components-skills
Open the skill to read its SKILL.md instructions.
syncfusion-aspnetcore-security
syncfusion/aspnetcore-ui-components-skills
Open the skill to read its SKILL.md instructions.
Popular frontend & design skills
setup-matt-pocock-skills
mattpocock/skills
Configure this repo for the engineering skills: set up its issue tracker, triage label vocabulary, and domain doc layout. Run once before first use of the other engineering skills.
frontend-design
anthropics/skills
Guidance for distinctive, intentional visual design when building new UI or reshaping an existing one. Helps with aesthetic direction, typography, and making choices that don't read as templated defaults.
hyperframes-animation
heygen-com/hyperframes
All animation knowledge for HyperFrames — atomic motion rules, multi-phase scene blueprints, scene transitions, broader motion-design techniques, AND the seven runtime adapters (GSAP default, plus Lottie, Three.js, Anime.js, CSS keyframes, Web Animations API, TypeGPU). Use for any motion or animation task: pick 2-4 rules and compose, or load a blueprint, or look up runtime-specific API (e.g. GSAP eases / Lottie player / Three.js mixer). Also covers auditing an existing composition's choreography (animation map) and 24 named text-animation effects. HyperFrames-native: single paused timeline, seek-safe, deterministic.
prototype
mattpocock/skills
Build a throwaway prototype to answer a design question. Use when the user wants to sanity-check whether a state model or logic feels right, or explore what a UI should look like.
hyperframes-core
heygen-com/hyperframes
The HyperFrames composition contract — build one renderable project. Use for composition structure, the data- timing attributes, class="clip", tracks, sub-compositions, variables, framework-owned media playback, deterministic-render rules, and validation. Read before writing composition HTML.
vercel-react-best-practices
vercel-labs/agent-skills
React and Next.js performance optimization guidelines from Vercel Engineering. This skill should be used when writing, reviewing, or refactoring React/Next.js code to ensure optimal performance patterns. Triggers on tasks involving React components, Next.js pages, data fetching, bundle optimization, or performance improvements.