A fully customizableReact-TailwindCSScomponent library

Expressive, variant driven styling and configuration

npm install @rewind-ui/core
Give it a goCurved arrow pointing to configurator
Rewind-UI is a React component library that provides a set of accessible, reusable, and customizable components to help you build your next project. We've designed our components to be flexible and easy to use, so you can focus on what matters most: building great user experiences.
Getting started with Rewind-UI is easy! Simply install the package using your package manager of choice, and you're ready to go. We've also included a set of Storybook stories to help you get familiar with our components and how to use them.
We're always looking for new contributors to help us improve Rewind-UI! If you'd like to contribute, please check out our contribution guidelines to get started. We're looking forward to working with you!
If you'd like to learn more about Rewind-UI, please visit our website. You can also follow us on Twitter to stay up to date with the latest news and updates.
import { Accordion } from '@rewind-ui/core';

function App() {
  return (
    <Accordion defaultItem="item-1" activeColor="purple" bordered={false} shadow="base" shadowColor="gray">
      <Accordion.Item anchor="item-1">
        <Accordion.Header>Header</Accordion.Header>
        <Accordion.Body>Body</Accordion.Body>
      </Accordion.Item>

      <Accordion.Item anchor="item-2">
        <Accordion.Header>Header</Accordion.Header>
        <Accordion.Body>Body</Accordion.Body>
      </Accordion.Item>

      <Accordion.Item anchor="item-3">
        <Accordion.Header>Header</Accordion.Header>
        <Accordion.Body>Body</Accordion.Body>
      </Accordion.Item>
    </Accordion>
  );
}

Features

Aiming to become the most feature-rich React UI component library

Pre-styled components

We all love headless UI libraries, but sometimes we just want to get started quickly. Rewind-UI comes with pre-styled components that you can use out of the box.

Themeable

Using the CVA library, Rewind-UI provides a themeable styling system that allows you to easily customize the look and feel of your components.

Accessible

Rewind-UI is built with accessibility in mind. All components are WAI-ARIA compliant and follow the best practices for accessibility, including keyboard interactions.

Interactive documentation

Rewind-UI comes with a detailed documentation that includes interactive examples and code snippets for each component.

Support the project

We are still in beta, but you can help us grow!

If you see value in this project, please consider supporting it.

  • Spread the word
  • Star Rewind-UI repo on GitHub