primereact alternatives and similar libraries
Based on the "Responsive" category.
Alternatively, view primereact alternatives based on common mentions on social networks and blogs.
-
chakra-ui
⚡️ Simple, Modular & Accessible UI Components for your React Applications -
office-ui-fabric-react
Fluent UI web represents a collection of utilities, React components, and web components for building web applications. -
semantic-ui-react
The official Semantic-UI-React integration -
grommet
a react-based framework that provides accessibility, modularity, responsiveness, and theming in a tidy package -
base web
A React Component library implementing the Base design language -
rebass
:atom_symbol: React primitive UI components built with styled-system. -
semi-design
🚀A modern, comprehensive, flexible design system and React UI library. 🎨 Provide more than 2,739+ Design Tokens and powerful DSM tools, easy to build your own design system. Make Semi Design to Any Design -
searchkit
Search UI for Elasticsearch & Opensearch. Compatible with Algolia's Instantsearch and Autocomplete components. React & Vue support -
gestalt
A set of React UI components that supports Pinterest’s design language -
zeit-ui-react
A design system for building modern websites and applications. -
flowbite-react
Official React components built for Flowbite and Tailwind CSS -
orbit-components
React components of open-source Orbit design system by Kiwi.com -
@artsy/fresnel
An SSR compatible approach to CSS media query based responsive layouts for React. -
CoreUI for React
CoreUI React.js UI Components. CoreUI for React.js replaces and extends the Bootstrap javascript. Components have been built from scratch as true React.js hook components, without jQuery and unneeded dependencies. -
AgnosticUI
AgnosticUI is a set of UI primitives that start their lives in clean HTML and CSS. These standards compliant components are then copied to our framework implementations in: React, Vue 3, Angular, and Svelte. -
react-foundation-apps
Foundation Apps components built with React -
fluent-ui
🌈 React components that inspired by Microsoft's Fluent Design System. -
atomize-by-quarkly
library for creating atomic react components -
cdbreact
Contrast Design Bootstrap : Elegant UI Kit and reusable components for building mobile-first, responsive websites and web apps -
insites-ui
An opinionated UI components library for React. Based on Styled Components and Styled System. -
react-uikit-components
React UIkit Components for the UIKit CSS framework -
atlaskit
Atlassian's official UI library. (Please... no more Jira though 😉) -
radix-ui
Unstyled, accessible components for building high‑quality design systems and web apps. -
Autocomplete
Accessible autocomplete, combobox, multiselect component for React.
Appwrite - The open-source backend cloud platform
Do you think we are missing an alternative of primereact or a related project?
README
PrimeReact
PrimeReact is a rich set of open source UI Components for React. See PrimeReact homepage for live showcase and documentation.
Download
PrimeReact is available at npm, if you have an existing application run the following command to download it to your project.
// with npm
npm install primereact primeicons
// with yarn
yarn add primereact primeicons
Please note that react >= 17.0.0 and react-dom >= 17.0.0 are peer dependencies and some components have optional dependencies.
Import
Module
//import { ComponentName } from 'primereact/{componentname}';
import { Dialog } from 'primereact/dialog';
import { Accordion, AccordionTab } from 'primereact/accordion';
CDN
<script src="https://unpkg.com/primereact/core/core.min.js"></script>
<script src="https://unpkg.com/primereact/accordion/accordion.min.js"></script>
//<script src="https://unpkg.com/primereact/{componentname}/{componentname}.min.js"></script>
const { Dialog } = primereact.dialog;
const { Accordion, AccordionTab } = primereact.accordion;
Import all components and structures
<script src="https://unpkg.com/primereact/primereact.all.min.js"></script>
Dependencies
Majority of PrimeReact components (95%) are native and there are some exceptions having 3rd party dependencies such as Google Maps for GMap.
In addition, components require PrimeIcons for icons and react-transition-group for animations. The react-transition-group is available as dependencies in the npm package of PrimeReact.
dependencies: {
"react": "^17.0.0 || ^18.0.0",
"react-dom": "^17.0.0 || ^18.0.0",
"primeicons": "^5.0.0"
}
Optional
Here is the list of components with 3rd party dependencies.
Component | Dependency |
---|---|
Charts | Charts.js 3.x |
GMap | Google Maps |
Editor | Quill.js |
FullCalendar* | FullCalendar 4.0 Alpha.2+ |
DataView | PrimeFlex |
*Deprecated since v6.4.0
Styles
The css dependencies are as follows, note that you may change the theme with another one of your choice.
primereact/resources/themes/lara-light-indigo/theme.css
primereact/resources/primereact.min.css
primeicons/primeicons.css
If you are using a bundler such as webpack with a css loader you may also import them to your main application component, an example from create-react-app would be.
import 'primereact/resources/themes/lara-light-indigo/theme.css';
import 'primereact/resources/primereact.min.css';
import 'primeicons/primeicons.css';
QuickStart
Example applications based on create-react-app and Next.js are available at github.
TypeScript
Typescript is fully supported as type definition files are provided in the npm package of PrimeReact. A sample typescript-primereact application is available as well at github.
Contributors
*Note that all licence references and agreements mentioned in the primereact README section above
are relevant to that project's source code only.