You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

83 lines
9.4 KiB

---
id: ui-components
title: UI Components
layout: community
permalink: community/ui-components.html
---
## Free Components {#free-components}
* **[Amaze UI React](https://github.com/amazeui/amazeui-react) (in Chinese):** [Amaze UI](https://github.com/allmobilize/amazeui) components built with React.
* **[Ant Design of React](https://github.com/ant-design/ant-design)** An enterprise-class UI design language and React-based implementation.
* **[Belle](https://github.com/nikgraf/belle/):** Configurable React Components with great UX.
* **[chartify](https://github.com/kirillstepkin/chartify)**: Ultra lightweight and customizable React.js chart component.
* **[Elemental UI](http://elemental-ui.com):** A UI toolkit for React websites and apps, themeable and composed of individually packaged components
* **[Grommet](https://grommet.io/)** The most advanced open source UX framework for enterprise applications.
* **[Halogen](https://yuanyan.github.io/halogen/):** A collection of highly customizable loading spinner animations with React.
* **[Khan Academy's component library](https://khan.github.io/react-components/)**
* **[markdown-to-jsx](https://www.npmjs.com/package/markdown-to-jsx)**: compiles markdown into safe React JSX without using dangerous escape hatches.
* **[Material-UI](https://material-ui.com/):** React components that implement Google's Material Design.
* **[Mobiscroll Lite for React](https://mobiscroll.com/forms/react):** A collection of 15 free UI components ranging from inputs, selects, sliders, alerts to rating.
* **[Onsen UI React Components](https://onsen.io/v2/react.html):** UI components for hybrid mobile apps with both Material Design for Android and flat design for iOS.
* **[PrimeReact](https://www.primefaces.org/primereact/):** A rich UI component suite for React featuring 70+ open source components.
* **[React Amazing Grid](https://github.com/Amazing-Space-Invader/react-amazing-grid)** Flex grid with inline styles.
* **[Material Components for React](https://github.com/material-components/material-components-web-react)** MDC React is the official implementation of Google's Material Design Components.
* **[React Native for Web](https://github.com/necolas/react-native-web)** Makes it possible to run React Native components and APIs on the web using React DOM.
* **[react-amiga-guru-meditation](https://github.com/gfazioli/react-amiga-guru-meditation):** React JS Class to display a Amiga Guru Meditation Tribute
* **[react-autosuggest](https://github.com/moroshko/react-autosuggest)** WAI-ARIA compliant React autosuggest component
* **[react-beautiful-dnd](https://github.com/atlassian/react-beautiful-dnd):** Beautiful, accessible drag and drop for lists with React.js
* **[react-bootstrap](https://github.com/stevoland/react-bootstrap):** Bootstrap 3 components built with React.
* **[react-bootstrap-dialog](https://github.com/akiroom/react-bootstrap-dialog):** React Dialog component for react-bootstrap, instead of `window.alert` or `window.confirm`
* **[react-bootstrap-table2](https://github.com/react-bootstrap-table/react-bootstrap-table2):** It's a react table for Bootstrap.
* **[react-component](https://github.com/react-component/):** A collection of react components maintained by Alibaba/Alipay employee.
* **[react-data-menu](https://github.com/dkozar/react-data-menu):** Smart data-driven menu rendered in an overlay. Hints-based aligning with custom renderers and factories. Never clipped by other components or screen edges.
* **[react-date-picker](https://github.com/Hacker0x01/react-datepicker):** A simple and reusable datepicker component for React.
* **[react-dates](https://github.com/OpusCapita/react-dates):** Date-inputs + date-picker
* **[react-dnd](https://github.com/gaearon/react-dnd)** Flexible HTML5 drag-and-drop mixin for React with full DOM control
* **[react-document-title](https://github.com/gaearon/react-document-title)** Declarative, nested, stateful, isomorphic document.title for React
* **[react-dropzone](https://github.com/felixrieseberg/React-Dropzone):** React Dropzone for File-Uploads
* **[react-forms](https://prometheusresearch.github.io/react-forms/):** Form rendering and validation for React
* **[react-highlight](https://github.com/akiran/react-highlight):** React component for syntax highlighting
* **[react-image](https://github.com/mbrevda/react-image):** Like `<img />` and Enhanced Image Component for React.
* **[react-input-autosize](https://github.com/JedWatson/react-input-autosize):** Like `<input />` but resizes automatically to fit all its content.
* **[react-intense](https://github.com/brycedorn/react-intense):** A component for viewing large images up close
* **[react-joyride](https://github.com/gilbarbara/react-joyride):** Create walkthroughs and guided tours for your ReactJS apps.
* **[react-ladda](https://github.com/jsdir/react-ladda):** React wrapper for Ladda buttons.
* **[react-lorem-component](https://github.com/martinandert/react-lorem-component):** Lorem Ipsum placeholder component.
* **[react-notification](https://github.com/pburtchaell/react-notification):** Snackbar style notifications
* **[react-select](https://github.com/JedWatson/react-select):** Native React Select / Multiselect input field, similar to Selectize / Chosen / Select2
* **[react-selectize](https://furqanzafar.github.io/react-selectize/):** A stateless & flexible Select component, designed as a drop in replacement for React.DOM.Select, inspired by Selectize
* **[react-sigma](https://www.npmjs.com/package/react-sigma)**: Lightweight but powerful library for drawing network graphs
* **[react-slick](https://github.com/akiran/react-slick):** Carousel component built with React
* **[react-sparklines](https://borisyankov.github.io/react-sparklines/):** Beautiful and expressive sparklines component
* **[react-spreadsheet](https://github.com/felixrieseberg/React-Spreadsheet-Component):** React Spreadsheets / Editable tables with Excel-Style keyboard input and navigation
* **[react-toggle](https://github.com/gfazioli/react-toggle):** A React UI component to display a toggle button control
* **[react-tappable](https://github.com/JedWatson/react-tappable)** A Tappable React Component that provides native-feeling onTap events for mobile React apps
* **[react-textarea-autosize](https://github.com/andreypopp/react-textarea-autosize):** Like `<textarea />` but resizes automatically to fit all its content.
7 years ago
* **[react-toastify](https://github.com/fkhadra/react-toastify):** React notification made easy
* **[React-TimeAgo](https://www.npmjs.org/package/react-timeago)** A minimal live updating Time Ago component that smartly converts any time to a 'ago' or 'from now' format and keeps it updated.
* **[react-translate-component](https://github.com/martinandert/react-translate-component):** React component for i18n.
* **[react-treeview](https://github.com/chenglou/react-treeview):** Easy, light, flexible tree view.
* **[react-uwp](https://www.react-uwp.com)** A set of React Components that Implement Microsoft's UWP Design & Fluent Design..
* **[react-validate-framework](https://github.com/MinJieLiu/react-validate-framework)**: A lightweight and extensible React validation component.
* **[reactstrap](https://reactstrap.github.io/):** Simple Bootstrap 4 components built with [tether](http://tether.io/)
* **[Reakit](https://reakit.io/):** Toolkit for building accessible rich web apps with React.
* **[recharts](https://github.com/recharts/recharts)**: A composable charting library built on React components.
* **[Selectivity](https://arendjr.github.io/selectivity/):** Modular and light-weight selection library.
* **[Semantic-ui](https://react.semantic-ui.com/)**: The official Semantic-UI-React integration, Advanced components and declarative UI.
* **[storybook-addon-material-ui](https://github.com/sm-react/storybook-addon-material-ui)** A storybook addon for material-ui.
* **[tcomb-form](https://github.com/gcanti/tcomb-form):** Automatically generate form markup, automatic labels and inline validation from a domain model.
* **[valuelink](https://github.com/Volicon/valuelink):** Full-featured two-way data binding and forms validation with extended React links.
* **[video-react](https://github.com/video-react/video-react)**: A web video player built for the HTML5 world using React library.
* **[Winterfell](https://github.com/andrewhathaway/Winterfell):** Generate complex, validated and extendable JSON-based forms in React
## Fee Based Components {#fee-based-components}
* **[ag-Grid](https://www.ag-grid.com)** Advanced data grid / data table for React.
* **[DevExtreme Reactive](https://devexpress.github.io/devextreme-reactive/react/)** High-performance plugin-based Data Grid, Scheduler and Chart components for Bootstrap and Material Design.
* **[ExtReact components](https://www.sencha.com/products/extreact//)**: 115+ Ready-to-Use UI Components.
* **[Grapecity Wijmo UI Components for React](https://www.grapecity.com/en/react/)**: Expand your React UI options with Wijmo’s complete collection of JavaScript components.
* **[jQWidgets React components](https://www.jqwidgets.com/react/)**: Enterprise Ready 70+ UI Components.
* **[KendoReact](https://www.telerik.com/kendo-react-ui/)**: UI for React Developers.
* **[Mobiscroll React UI Components](https://mobiscroll.com/react)** Mobile UI Controls for the Productive React Developer.
* **[React UI Toolkit](https://react-ui-tools.com/)**: 115+ professionally maintainted UI components ranging from a robust grid to charts and more. Try for FREE and build React apps faster.