Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/syncfusion/ej2-javascript-ui-controls

Syncfusion JavaScript UI controls library offer more than 50+ cross-browser, responsive, and lightweight HTML5 UI controls for building modern web applications.
https://github.com/syncfusion/ej2-javascript-ui-controls

accessibility aspnet-core aspnet-mvc bootstrap charts data-grid data-visualization diagram-generator form-controls javascript javascript-ui material-design module-pattern office-ui-fabric pivot-grid scheduler ui-components ui-controls ui-library word-processor

Last synced: 16 days ago
JSON representation

Syncfusion JavaScript UI controls library offer more than 50+ cross-browser, responsive, and lightweight HTML5 UI controls for building modern web applications.

Awesome Lists containing this project

README

        



Syncfusion Inc.
Syncfusion JavaScript UI Controls Library


npm
  license

The Syncfusion JavaScript UI controls library is the only suite that you will ever need to build an application since it contains over 65 high-performance, lightweight, modular, and responsive UI components in a single package.

[![Screens of showcase applications](https://ej2.syncfusion.com/products/ej2-banner.gif)](https://syncfusion.com/javascript-ui-controls/)

*Screens of [showcase applications](#showcase-applications) created using Syncfusion Essential JS 2 UI controls*

## Table of Contents
* [Framework highlights](#framework-highlights)
* [Control list](#control-list)
* [Grids](#grids)
* [Editors](#editors)
* [Dropdowns](#dropdowns)
* [Data Visualization](#data-visualization)
* [Calendars](#calendars)
* [Navigation](#navigation)
* [Buttons](#buttons)
* [Layout](#layout)
* [Notification](#notification)
* [Viewer](#viewer)
* [Resources](#resources)
* [Supported Frameworks](#supported-frameworks)
* [Showcase Applications](#showcase-applications)
* [Release Notes](#release-notes)
* [License](#license)

## Framework highlights
### Lightweight and user friendly
The entire Essential JS 2 framework is built from scratch to be lightweight and modular. Its footprint can be reduced further by including only the specific components and features your application requires.
### Modular architecture
All components have been built as modules to enable selective referencing, so only the components and features you need are included in your application.
### Built for performance
Performance is critical for delivering a good user experience. We ensure that all our components are designed and built to achieve the best performance possible.
### Responsive and touch friendly
All Essential JS 2 controls are touch friendly and render adaptively based on the device they are on to provide optimal usage experience on phones, tablets and desktops.
### Stunning built-in themes
Pixel-perfect built-in themes are available in material, bootstrap and fabric design. In addition, it comes with Accessible high-contrast theme and an online tool "[Theme Studio](https://ej2.syncfusion.com/themestudio/)" to customize the provided built-in themes.
### Globalization simplified
Easily build applications to be used by a global audience in various language and culture settings.
### Stay current
With our commitment to at least four major updates per year, you receive the most up-to-date functionality and new components in addition to monthly service packs and bug fixes. Custom patches are available as needed.

## Control List

### Grids



Data Grid


npm package @syncfusion/ej2-grids      code coverage of @syncfusion/ej2-grids


Source


Live demo


Documentation




Pivot Table


npm package @syncfusion/ej2-pivotview      code coverage of @syncfusion/ej2-pivotview


Source


Live demo


Documentation




Spreadsheet


npm package @syncfusion/ej2-spreadsheet      code coverage of @syncfusion/ej2-spreadsheet


Source


Live demo


Documentation




Tree Grid


npm package @syncfusion/ej2-treegrid      code coverage of @syncfusion/ej2-treegrid


Source


Live demo


Documentation

### Editors



In-place Editor


npm package @syncfusion/ej2-inplace-editor      code coverage of @syncfusion/ej2-inplace-editor


Source


Live demo


Documentation




Rich Text Editor


npm package @syncfusion/ej2-richtexteditor      code coverage of @syncfusion/ej2-richtexteditor


Source


Live demo


Documentation




Word Processor


npm package @syncfusion/ej2-documenteditor      code coverage of @syncfusion/ej2-documenteditor


Source


Live demo


Documentation

### Dropdowns



AutoComplete


npm package @syncfusion/ej2-dropdowns      code coverage of @syncfusion/ej2-dropdowns


Source


Live demo


Documentation




ComboBox


Source


Live demo


Documentation




Dropdown List


Source


Live demo


Documentation




Dropdown Tree


Source


Live demo


Documentation




List Box


Source


Live demo


Documentation




MultiSelect Dropdown


Source


Live demo


Documentation

### Inputs



Checkbox


npm package @syncfusion/ej2-buttons      code coverage of @syncfusion/ej2-buttons


Source


Live demo


Documentation




Radio Button


Source


Live demo


Documentation




Toggle Switch Button


Source


Live demo


Documentation




Color Picker


npm package @syncfusion/ej2-inputs      code coverage of @syncfusion/ej2-inputs


Source


Live demo


Documentation




File Upload


Source


Live demo


Documentation




Form Validation


Source


Live demo


Documentation




Input Mask


Source


Live demo


Documentation




Numeric Textbox


Source


Live demo


Documentation




Range Slider


Source


Live demo


Documentation




TextBox


Source


Live demo


Documentation




Signature


Source


Live demo


Documentation

### Data Visualization



Barcode Generator


npm package @syncfusion/ej2-barcode-generator      code coverage of @syncfusion/ej2-barcode-generator


Source


Live demo


Documentation




Circular Gauge


npm package @syncfusion/ej2-circulargauge      code coverage of @syncfusion/ej2-circulargauge


Source


Live demo


Documentation




Diagram


npm package @syncfusion/ej2-diagrams      code coverage of @syncfusion/ej2-diagrams


Source


Live demo


Documentation




HeatMap Chart


npm package @syncfusion/ej2-heatmap      code coverage of @syncfusion/ej2-heatmap


Source


Live demo


Documentation




Kanban


npm package @syncfusion/ej2-kanban      code coverage of @syncfusion/ej2-kanban


Source


Live demo


Documentation




Linear Gauge


npm package @syncfusion/ej2-lineargauge      code coverage of @syncfusion/ej2-lineargauge


Source


Live demo


Documentation




Maps


npm package @syncfusion/ej2-maps      code coverage of @syncfusion/ej2-maps


Source


Live demo


Documentation




TreeMap


npm package @syncfusion/ej2-treemap      code coverage of @syncfusion/ej2-treemap


Source


Live demo


Documentation




Bullet Chart


npm package @syncfusion/ej2-charts      code coverage of @syncfusion/ej2-charts


Source


Live demo


Documentation




Charts


Source


Live demo


Documentation




Range Selector


Source


Live demo


Documentation




Smith Chart


Source


Live demo


Documentation




Sparkline Charts


Source


Live demo


Documentation




Stock Chart


Source


Live demo


Documentation

### Calendars



Calendar


npm package @syncfusion/ej2-calendars      code coverage of @syncfusion/ej2-calendars


Source


Live demo


Documentation




DatePicker


Source


Live demo


Documentation




DateRangePicker


Source


Live demo


Documentation




DateTime Picker


Source


Live demo


Documentation




TimePicker


Source


Live demo


Documentation




Gantt Chart


npm package @syncfusion/ej2-gantt      code coverage of @syncfusion/ej2-gantt


Source


Live demo


Documentation




Scheduler


npm package @syncfusion/ej2-schedule      code coverage of @syncfusion/ej2-schedule


Source


Live demo


Documentation

### Navigation



Accordion


npm package @syncfusion/ej2-navigations      code coverage of @syncfusion/ej2-navigations


Source


Live demo


Documentation




Breadcrumb


Source


Live demo


Documentation




Carousel


Source


Live demo


Documentation




Context Menu


Source


Live demo


Documentation




Menu Bar


Source


Live demo


Documentation




Sidebar


Source


Live demo


Documentation




Tabs


Source


Live demo


Documentation




Toolbar


Source


Live demo


Documentation




TreeView


Source


Live demo


Documentation




File Manager


npm package @syncfusion/ej2-filemanager      code coverage of @syncfusion/ej2-filemanager


Source


Live demo


Documentation

### Buttons



Button


npm package @syncfusion/ej2-buttons      code coverage of @syncfusion/ej2-buttons


Source


Live demo


Documentation




Chips


Source


Live demo


Documentation




Button Group


npm package @syncfusion/ej2-splitbuttons      code coverage of @syncfusion/ej2-splitbuttons


Source


Live demo


Documentation




Dropdown Menu


Source


Live demo


Documentation




Progress Button


Source


Live demo


Documentation




Split Button


Source


Live demo


Documentation

### Layout



Avatar


npm package @syncfusion/ej2-layouts      code coverage of @syncfusion/ej2-layouts


Styles


Live demo


Documentation




Card


Styles


Live demo


Documentation




Dashboard Layout


Source


Live demo


Documentation




Splitter


Source


Live demo


Documentation




Dialog


npm package @syncfusion/ej2-popups      code coverage of @syncfusion/ej2-popups


Source


Live demo


Documentation




Tooltip


Source


Live demo


Documentation




ListView


npm package @syncfusion/ej2-lists      code coverage of @syncfusion/ej2-lists


Source


Live demo


Documentation

### Notification



Badge


npm package @syncfusion/ej2-notifications      code coverage of @syncfusion/ej2-notifications


Styles


Live demo


Documentation




Toast


Source


Live demo


Documentation




Progress Bar


npm package @syncfusion/ej2-progressbar      code coverage of @syncfusion/ej2-progressbar


Source


Live demo


Documentation

### Forms



Query Builder UI


npm package @syncfusion/ej2-querybuilder      code coverage of @syncfusion/ej2-querybuilder


Source


Live demo


Documentation

### Viewer



PDF Viewer


npm package @syncfusion/ej2-pdfviewer      code coverage of @syncfusion/ej2-pdfviewer


Source


Live demo


Documentation


## Supported Frameworks

| [](https://www.syncfusion.com/angular-ui-components?utm_medium=listing&utm_source=github)
     [Angular](https://www.syncfusion.com/angular-ui-components?utm_medium=listing&utm_source=github)     | [](https://www.syncfusion.com/react-ui-components?utm_medium=listing&utm_source=github)
       [React](https://www.syncfusion.com/react-ui-components?utm_medium=listing&utm_source=github)       | [](https://www.syncfusion.com/vue-ui-components?utm_medium=listing&utm_source=github)
       [Vue](https://www.syncfusion.com/vue-ui-components?utm_medium=listing&utm_source=github)          | [](https://www.syncfusion.com/aspnet-core-ui-controls?utm_medium=listing&utm_source=github)
  [ASP.NET Core](https://www.syncfusion.com/aspnet-core-ui-controls?utm_medium=listing&utm_source=github)   | [](https://www.syncfusion.com/aspnet-mvc-ui-controls?utm_medium=listing&utm_source=github)
  [ASP.NET MVC](https://www.syncfusion.com/aspnet-mvc-ui-controls?utm_medium=listing&utm_source=github)   | [](https://www.syncfusion.com/blazor-components?utm_medium=listing&utm_source=github)
      [Blazor](https://www.syncfusion.com/blazor-components?utm_medium=listing&utm_source=github)       |
| :-----: | :-----: | :-----: | :-----: | :-----: | :-----: |

## Showcase Applications




Appointment Planner




Appointment Planner







Diagram Builder




Diagram Builder







Stock Chart




Stock Chart







IT Asset Management




IT Asset Management







Expense Tracker




Expense Tracker







Web Mail




Web Mail







Loan Calculator




Loan Calculator







Health Tracker




Health Tracker







Task Planner




Task Planner




## Resources
* [Documentation](https://ej2.syncfusion.com/documentation/)
* [Theme Studio](https://ej2.syncfusion.com/themestudio/)
* [Custom Resource Generator](https://crg.syncfusion.com/)
* [Contact Support](https://www.syncfusion.com/support/directtrac/incidents/newincident?utm_medium=listing&utm_source=github)
* [Forums](https://www.syncfusion.com/forums/essential-js2?utm_medium=listing&utm_source=github)
* [What's New](https://www.syncfusion.com/products/whatsnew/essential-js2?utm_medium=listing&utm_source=github)
* [Road Map](https://www.syncfusion.com/products/roadmap/essential-js2?utm_medium=listing&utm_source=github)
* [E-Books](https://www.syncfusion.com/ebooks?tag=javascript&utm_medium=listing&utm_source=github)

## Release Notes
Please refer this [link](https://ej2.syncfusion.com/documentation/release-notes/index/)

## License
This is a commercial product and requires a paid license for possession or use. Syncfusion’s licensed software, including this component, is subject to the terms and conditions of Syncfusion's EULA (https://www.syncfusion.com/eula/es/). To acquire a license, you can purchase one at https://www.syncfusion.com/sales/products or start a free 30-day trial here (https://www.syncfusion.com/account/manage-trials/start-trials).
A free community license (https://www.syncfusion.com/products/communitylicense) is also available for companies and individuals whose organizations have less than $1 million USD in annual gross revenue and five or fewer developers.
© Copyright 2021 Syncfusion, Inc. All Rights Reserved.
The Syncfusion Essential Studio license and copyright applies to this distribution.