What is reablocks?
reablocks is a set of beautifully designed, highly customizable, open-source React components based on Tailwind (opens in a new tab) and Framer Motion (opens in a new tab). It combines the flexibility and ease of Tailwind CSS with the power of Framer Motion to create a seamless and intuitive experience for building modern web applications.
Why reablocks?
There are many React component libraries out there, but reablocks is unique in a few ways:
- Highly Customizable: reablocks is built on top of Tailwind CSS, which allows for a high level of customization and flexibility. You can easily change the look and feel of your components by tweaking the Tailwind classes. No longer are you locked into a specific design system or its opinions.
- Seamless Animations: reablocks uses Framer Motion for animations and transitions, which makes it easy to add motion to your components. You can create smooth animations with just a few lines of code.
- Easy to Use: reablocks provides a simple and intuitive API that makes it easy to build modern web applications. You can quickly create beautiful UIs without having to write a lot of custom CSS or JavaScript.
- Batteries-Included: reablocks comes with a set of pre-designed components that you can use out of the box. This includes logins, reset password, manage team and more.
- Battle-Tested: reablocks is used in production on dozens of enterprise products and has been battle-tested in real-world applications.
- Storybook-first: reablocks is built with Storybook in mind. Every component is documented with examples and usage guidelines in Storybook. You can even easily import these stories into your own Storybook setup.
- Enterprise focused: reablocks is built with enterprise applications in mind. It includes features components that lend themselves more towards business applications than consumer applications.
- Open Source: reablocks is open-source and free to use and we plan to keep it that way. You can use it in your personal or commercial projects.
- Real Code, Not Wrappers: reablocks is built with real code, not wrappers around existing libraries. Everything from the select box to the radial charts are all part of the reaviz (opens in a new tab) portfolio.
To learn more about why reablocks, check out the Philosophy page.
How do I get started?
To get started with reablocks, check out the Getting Started page. It will walk you through how to install reablocks and get up and running with your first component.