# Best FrontEnd & New ReUsable Component Libraries For React JS 2024
Youtube Video
1. ShadCN
-
- Description: This is not a library of components. You can copy and paste this collection of reusable components into your apps.
-
Advantages:
- Ownership and Control over Components✔️
- Style is not coupled with the implementation✔️
- Works on Any Framework That Supports React Like Next.js, Astro, Remix, Gatsby etc.✔️
-
Improvements:
- Harder to Setup for beginners ❌
2. Plate.js
- Plate.js
-
- Description: Plugin system & primitive component library. CLI for styled components. Customizable. Open Source
-
Advantages:
- Easier to Setup ✔️
- Code and Custom Plugins Can be Set.✔️
- Based On RadixUI, and ShadCN/UI.✔️
-
Improvements:
- Newer Library With a unique way to setup that can be simplified.❌
3. Radix UI
-
- Description: A pre-styled component library called Radix Themes is intended to function right out of the box with little setup required. Visit Radix Primitives if you're seeking for the unstyled components.
-
Advantages:
- Works on Any Framework That Supports React Like Next.js, Astro, Remix, Gatsby etc.✔️
- Can Install an icon package as well
npm i @radix-ui/react-icons
✔️ - Can have a custom Color Palette like TailwindCSS Custom Colors.✔️
- Can Install individual Components using Primitives.✔️
-
Improvements:
- Harder to Setup ❌
- No Ownership and Full Control over Components❌
4. Acternity UI
-
- Description: A UI library with visually appealing components built on Next.js, React, TailwindCSS, and Framer Motion.
-
Advantages:
- Works on Any Framework That Supports React Like Next.js, Astro, Remix, Gatsby etc.✔️
- Best UI Looking Components✔️
- Can Install Multiple Free Reusable Components.✔️ Components
- Ownership and Full Control over Components
-
Improvements:
- Needs some dependencies to work properly (
framer-motion clsx tailwind-merge @tabler/icons-react
), however, these packages are what makes it simple to use something like Acternity UI.❌
- Needs some dependencies to work properly (
5. NextUI
-
- Description: With the aid of the React UI library NextUI, you can create stunning and easily navigable user interfaces. Built around React Aria and Tailwind CSS.
-
Advantages:
- Independent community project From Vercel. ✔️
- Built on React TailwindCSS ✔️
- Can Install individual Components✔️
- Provides a set of accessible and customizable components, hooks, and utilities.✔️
Top comments (3)
Thanks for sharing this. Acternity UI looks promising, I am tempted to try this on my future projects!
You didn't add Ant Design .... compared to the rest antd >>> {...the rest of the UI Librarys}
ANT Design is considered old UI Library , the first release was back at 2015 ANT-Design Release on GITHUBthis was targeted to new Libraries as mentioned i can make another article on Old UI Libraries too thanks for the idea.