Get Started with KendoReact Free
Welcome to KendoReact Free, a rich library of free customizable UI components developed to enhance your React projects. To install all KendoReact Free components, run:
npm i @progress/kendo-react-animation @progress/kendo-react-buttons @progress/kendo-react-grid @progress/kendo-react-data-tools @progress/kendo-react-dateinputs @progress/kendo-react-dialogs @progress/kendo-react-dropdowns @progress/kendo-react-indicators @progress/kendo-react-inputs @progress/kendo-react-labels @progress/kendo-react-layout @progress/kendo-react-listbox @progress/kendo-react-notification @progress/kendo-react-popup @progress/kendo-react-progressbars @progress/kendo-react-tooltip @progress/kendo-theme-defaultNote that some packages contain both free and premium components and features. Reference this table to see all free React components.
What is KendoReact Free Component Library?
KendoReact Free is a free version of the KendoReact component library that includes over 50 customizable, enterprise-grade components. The free React component library includes essential components such as a performant React data grid, React date inputs, dropdowns, buttons and more, with features such as theming, accessibility, and localization.
All components included in KendoReact Free are part of KendoReact (premium) and, with a few exceptions (see React UI Components with Both Free and Premium Functionality), each component's full functionality is free.
KendoReact Free gives developers fast and easy access to one of the best React UI libraries for building enterprise-grade apps. To use the free React components in any project, all you need to do is npm install the respective package. You don't have to fill in a form or add a license key unless you want to use one of the premium components or features.
If you want to build a PoC or a live app using premium KendoReact components or features, you can start a trial (free 30-day access to the full library of 120+ components), or buy a license.
Read on for a detailed comparison between KendoReact and KendoReact Free as well as a list of additional free resources such as themes, Figma UI kits, and a starter dashboard template.
Wondering which components are free?
Explore the documentation. Premium components and features are clearly marked with a diamond icon. Components and features without the premium marker are free to use, even in production, with no sign-up or license required.
Installation
All KendoReact components (free and premium) are available on npm.
You can install any component with npm install. For example, here's the Buttons package.
npm i @progress/kendo-react-buttonsAfter that, simply import the component in your React app and start using it.
import { Button } from '@progress/kendo-react-buttons';
...
<Button>
Button Label
</Button>Visit the general First Steps with KendoReact page or the Getting Started page from the sidebar navigation for the component you're interested in.
All KendoReact packages use the KendoReact keyword and are published and maintained by Progress.
The Kendo UI Productivity Tools extension for Visual Studio Code is also freely available to all KendoReact developers, no license required. You can use it to kick off your KendoReact project with the built-in template wizard or to speed up development with the scaffolding and code snippets. Note that the templates, code snippets, and scaffolding that provide premium components and features, still require an active commercial or trial license to use.
Support
For any questions about KendoReact Free, or any other KendoReact components, these are the available support options:
- The KendoReact forums provide free support from the community.
- The KendoReact Feedback Portal and KendoReact Roadmap provide information on the features in discussion and also those planned for release.
- KendoReact uses GitHub Issues as its bug tracker, and you can submit any related reports there. Also, check out the closed list.
- Outstanding customer support, provided by the developers who build the library, available either with a 30-day free trial or an active commercial license.
Differences Between the Free and Premium React Component Libraries
KendoReact is an enterprise-grade UI library with 120+ free and premium components offering unmatched value for building business applications, including premium components such as the React Form, React Charts, and React Scheduler, unique features such as the React server components (RSC) data grid mode, as well as legendary support.
KendoReact Free is a free React component library. A subset of KendoReact, it includes 50+ free components and features sufficient to implement a functional production app. Some components provide a well-balanced blend of free and premium functionality. Read on to learn what's included with KendoReact Free and what additional benefits come with the complete KendoReact library.
Three Options: KendoReact Free, Free Trial, Complete Library
The following table outlines the key resources available with KendoReact and KendoReact Free.
| KendoReact Free | KendoReact Trial | KendoReact | |
|---|---|---|---|
| React components | 50+ | 120+ | 120+ |
| Four professional themes | |||
| Four Figma UI Kits | |||
| Page Templates & Building Blocks | 1 template | ||
| ThemeBuilder | Free* | Ultimate | Ultimate |
| Source code | No | No | |
| Visual Studio Code extension | 1 starter template | Full functionality | Full functionality |
| Legendary customer support | No | (trial) |
* This service requires a free Telerik account.
Free vs Premium React Components
The following table indicates the free React components included in KendoReact Free (left column), and those that are part of the premium offering (right column).
KendoReact includes all 120+ enterprise-grade components in the UI library. You gain access to the complete library with an active commercial or trial license.
| Installation | Package | KendoReact Free | Premium-Only |
|---|---|---|---|
| Animation | npm | ||
| Barcodes | npm | No | Barcode, QR Code |
| Buttons | npm | Button ButtonGroup Chip ChipList FloatingActionButton Toolbar | DropDownButton SplitButton |
| Chart Wizard | npm | No | |
| Charts | npm | No | Chart Sparkline StockChart Sankey |
| Common Utilities | npm | Icon SvgIcon Typography Keyboard Navigation | Drag&Drop |
| Conversational UI | npm | No | AIPrompt, Chat |
| Data Grid (Table) | npm | ** | ** |
| Data Query | npm | No | |
| Data Tools | npm | Pager | Filter |
| Date Inputs | npm | Calendar DateInput DatePicker DateTimePicker | DateRangePicker MultiViewCalendar TimePicker |
| Date Math | npm | No | |
| Dialogs | npm | Dialog Window | |
| Drawing | npm | No | |
| Dropdowns | npm | AutoComplete DropDownList** MultiSelect** | ComboBox DropDownList** DropDownTree MultiColumnComboBox MultiSelect** MultiSelectTree |
| Editor | npm | No | |
| Excel Export | npm | No | |
| File Saver | npm | No | |
| Form | npm | No | |
| Gantt | npm | No | |
| Gauges | npm | No | ArcGauge CircularGauge LinearGauge RadialGauge |
| Indicators | npm | Badge Loader Skeleton | |
| Inputs | npm | Checkbox ColorPalette Input MaskedTextBox NumericTextBox RadioButton RadioGroup Rating Slider Switch TextArea TextBox | ColorGradient ColorPicker FlatColorPicker RangeSlider Signature |
| Labels | npm | Label FloatingLabel Hint Error | |
| Layout | npm | ActionSheet AppBar Avatar BottomNavigation Breadcrumb Card ContextMenu Drawer ExpansionPanel GridLayout Menu PanelBar StackLayout Stepper TabStrip TileLayout | Splitter Timeline |
| ListBox | npm | ||
| ListView | npm | No | |
| Map | npm | No | |
| Notification | npm | ||
| OrgChart | npm | No | |
| PDF Processing | npm | No | |
| PDF Viewer | npm | No | |
| PivotGrid | npm | No | |
| Popup | npm | ||
| Progress Bars | npm | ProgressBar | ChunkProgressBar |
| Ripple | npm | No | |
| Scheduler | npm | No | |
| ScrollView | npm | No | |
| Sortable | npm | No | |
| Spreadsheet | npm | No | |
| TaskBoard | npm | No | |
| Tooltips | npm | Popover Tooltip | |
| TreeList | npm | No | |
| TreeView | npm | No | |
| Upload | npm | No |
** This component provides a blend of free and premium features.
React UI Components with Both Free and Premium Functionality
The following components provide have free and premium features. For a complete breakdown of the available features, check out the respective section in the current article or inspect the documentation in the navigation sidebar.
React Data Grid
The free feature set of the KendoReact Data Grid is yours to use in production, no license required. To benefit from premium data grid features, such as React server components (RSC) mode, custom cell rendering, advanced filtering, data export, and others, you need a commercial license or an active trial license.
The following table lists the free and premium-only features of the KendoReact Data Grid. With a valid commercial license or an active trial license, you gain access to all KendoReact Free features plus all premium features.
| Area | KendoReact Free | Premium-Only |
|---|---|---|
| Columns | Resizing of columns Reordering of columns Auto-resizing of columns Spanned columns | Locked columns Hidden columns Multi-column headers Column menu |
| Rows | Spanned rows Reordering of rows | Locked rows Detail rows |
| Custom cell rendering | No | Custom cells Custom group headers and footers Custom filter cells |
| Editing | In-cell editing In-cell editing of all cells | Inline editing (row editing) Inline editing with custom editors Inline editing with external form |
| Selection | Single row selection Cell selection Checkbox selection | Multiple row selection Selection aggregates Multi-range selection |
| Filtering | Global filter (quick filter) Row filtering (header filtering) | Column menu fitlering External filter Custom filter operations Multi-column filtering (Coming soon) |
| Sorting | Single column sorting | Multi-column sorting |
| Paging | No | Custom Pager |
| Virtualization | Numeric pager with drop-down Column virtualization | Row virtualization |
| Exporting | CVS export | PDF export Excel export |
| Loading | Loading indicator | |
| Grouping | No | Persisting group state Aggregates for grouped data Locked group Column groups the same as multi-column headers Row groups |
| Master-detail grid | No | Master-detail grid |
| Other | Print Accessibility Keyboard navigation Localization and globalization Styling Adaptiveness (Coming soon) | Clipboard copy Clipboard paste Chart integration Context menu OData support DataSource (Coming soon) |
| Server and hybrid data operations | No | Support for server templates Server actions Server-side rendering Server-side filtering Server-side selection Server-side filtering |
React DropDownList
The free feature set of the KendoReact DropDownList is yours to use in production, no license required. To benefit from the premium filtering and virtualization, you need a commercial license or an active trial license.
React MultiSelect
The free feature set of the KendoReact MultiSelect is yours to use in production, no license required. To benefit from the premium filtering, you need a commercial license or an active trial license.
Upgrading from KendoReact Free to KendoReact
To unlock the premium features and components of KendoReact, you need an active license. You can activate a 30-day free trial to try all 120+ UI components and benefit from the outstanding customer support. Or you can purchase a subscription and unlock multiple additional benefits such as source code access, year-long support, and access to Page Templates, Building Blocks and the ThemeBuilder Ultimate. (Note that the last three items are only included in the subscription and not in the perpetual license.)
Resources
- React tips and tricks from the Telerik Blogs.
- React knowledge base with real-life how-tos and troubleshooting articles.
- Industry-leading design and front-end documentation with best practices and helpful resources for best-in-class implementation.
- KendoReact roadmap that captures the future plans and commitments of the enterprise-grade library.
- KendoReact issue tracker and feedback portal.
- Explore the Free Project Tracker Sample Application
- Free Project Tracker app page template (built with free components)
FAQs
Can I Use the KendoReact Free Components in Production?
The KendoReact Free components are free to use in prototyping, development, testing, and production according to the terms and conditions of the KendoReact EULA. No sign-up or license is required.
Some KendoReact Free components may provide premium features which require an active commercial or trial license. Premium features and components are clearly indicated throughout the documentation. You can also find a complete list of the free and premium components in Free vs Premium React Components.
Can I Sell a Product Built with KendoReact Free Components?
. Applications built with KendoReact Free components don't require a commercial license to ship to your end users. However, if you have decided to add premium components or functionality to your app, you will need to obtain a commercial license or an active trial license.
How Can I Access Technical Support?
Developers working exclusively with KendoReact Free components can benefit from the free support resources available to the community and the public. If you need more specialized assistance, including from the developers who build the library, you can start a 30-day free trial or purchase a license.
Are the KendoReact Free Components Getting Regular Updates and Bug Fixes?
. KendoReact Free is part of the enterprise-grade KendoReact UI library, and not a separate library. All KendoReact components, including the free ones, are developed and maintained with the same attention to detail by the KendoReact development team. The entire library receives bug fixes, feature improvements, and new components and functionality on a regular basis.
Can I Access the Code?
KendoReact Free and KendoReact are not open source. Developers working exclusively with KendoReact Free cannot access the source code.
Developers with an active commercial license are eligible to receive access to the source code. Check out what's included when you purchase a license.