# React Barcodes Overview

The KendoReact Barcodes render common industry barcodes including a variety of one-dimensional (1D) and two-dimensional (2D or "matrix") barcodes suitable for display and high-quality prints.

<CtaPanelOverview></CtaPanelOverview>

## React Barcodes Example

The following example demonstrates the Barcode and QR Code in action.

[Demo Source](https://demos.telerik.com/kendo-react-ui/barcodes/overview/func/source.txt)

## Available Components

#### Premium React Barcodes

<Row>
  <Column count={6}>
    <Component href="/barcodes/barcode">
      <svg id="barcode" viewBox="0 0 24 24">
        <path d="M10,22h2V2h-2V22z M0,22h2V2H0V22z M5,16h2V2H5V16z M14,16h2V2h-2V16z M22,2v20h2V2H22z M18,16h2V2h-2V16z"/>
      </svg>
      <ComponentTitle>Barcode</ComponentTitle>
      <ComponentDescription>A component for rendering a variety of industry barcodes.</ComponentDescription>
    </Component>
  </Column>
  <Column count={6}>
    <Component href="/barcodes/qrcode">
      <svg id="qrcode" viewBox="0 0 24 24">
        <path d="M12,4h2V0h-4v2h2V4z M6,6H4v2h2V6z M10,4V2H8v2H10z M2,14H0v4h2V14z M18,12v-2h-4v2H18z M2,6H0v2h2V6z M4,2h4V0H0v4h4V2z
            M18,0h-2v2h2V0z M12,8v2h2V8H12z M4,14h2v-2H4V14z M10,16v-2H6v2H10z M2,10v2h2v-2H2z M8,6v4H6v2h4V8h2V6H8z M0,24h4v-4H0V24z
            M22,12h2V8h-2V12z M14,20v2h2v-2H14z M18,18h-2v2h2V18z M22,18h-2v2h4v-6h-2V18z M18,22h2v-2h-2V22z M18,4h-2v4h4V6h-2V4z M6,18H4
            v2h2V18z M20,0v6h2V4h2V0H20z M6,24h2v-2H6V24z M16,24h2v-2h-2V24z M24,24v-2h-4v2H24z M14,16h6v-2h-8v4h2V16z M12,20v-2H8v4h2v-2
            H12z M10,24h4v-2h-4V24z"/>
      </svg>
      <ComponentTitle>QR Code</ComponentTitle>
      <ComponentDescription>A dedicated component for QR Codes.</ComponentDescription>
    </Component>
  </Column>
</Row>

## React Barcodes Key Features

Each KendoReact Barcodes component delivers a range of developer-friendly features whose number and further development are not limited by the list in this section.

### Rendering Modes

The Barcodes support two modes for rendering—Canvas (bitmap) and SVG (vector graphics). By default, the Barcodes are rendered through SVG. Switching between the two is as easy as updating a single configuration option. [Read more about the rendering modes of the Barcode](https://www.telerik.com/kendo-react-ui-develop/components/barcodes/rendering).

### Export Options

The Barcodes provide built-in support to save your the output as an image (PNG), PDF, SVG, and the Kendo UI Drawing format (useful for further processing). [Read more about the export options of the Barcodes](https://www.telerik.com/kendo-react-ui-develop/components/barcodes/export-options).

## Licensing

All components in the KendoReact Barcodes package are premium and require a commercial license key or an active trial license key. The Barcodes package is part of the KendoReact library, which offers a 30-day trial with a full-featured version of the library—no restrictions! Sign up for a [free trial](https://www.telerik.com/try/kendo-react-ui) of KendoReact.

## Support Options

For any questions about the use of the KendoReact Barcodes, or any other [KendoReact components](https://www.telerik.com/kendo-react-ui/components/), there are [several support options available](https://www.telerik.com/kendo-react-ui/support):

* KendoReact license holders and anyone in an active trial can take advantage of the outstanding KendoReact customer support delivered by the developers who built the library. To submit a support ticket, use the [Kendo UI support system](https://www.telerik.com/account/support-tickets).
* The [KendoReact forums](https://www.telerik.com/forums/kendo-ui-react) are part of the free support you can get from the community and from the KendoReact team on all kinds of general issues.
* [KendoReact Feedback Portal](https://feedback.telerik.com/kendo-react-ui) and [KendoReact Roadmap](https://www.telerik.com/support/whats-new/kendo-react-ui/roadmap) provide information on the features in discussion and also those planned for release.
* KendoReact uses [GitHub Issues](https://github.com/telerik/kendo-react) as its bug tracker, and you can submit any related reports there. Also, check out the [closed list](https://github.com/telerik/kendo-react/issues?q=is%3Aissue+is%3Aclosed).
* Need something unique that is tailor-made for your project? Progress offers its [Progress Services](https://www.progress.com/services) group that can work with you to create any customized solution that you might need.

## Learning Resources

* [Getting Started with KendoReact](https://www.telerik.com/kendo-react-ui-develop/components/getting-started)
* [Getting Started with the KendoReact Barcodes](https://www.telerik.com/kendo-react-ui-develop/components/barcodes/get-started)
* [API Reference of the KendoReact Barcodes](https://www.telerik.com/kendo-react-ui-develop/components/barcodes/api)
* [KendoReact Free vs. Premium](https://www.telerik.com/kendo-react-ui-develop/components/getting-started/free-vs-premium)
* [Video Courses](https://www.telerik.com/kendo-react-ui-develop/components/getting-started/video-onboarding)
* [Before You Start: All Things React (Telerik Blog Post)](https://www.telerik.com/blogs/all-things-react)
* [Knowledge Base](https://www.telerik.com/kendo-react-ui/components/knowledge-base)