Nanasi UI provides a set of simple, reusable, and composable React components that make it super easy to create websites and apps.
Latest Components Documentation on Chromatic
- Ease of Styling with Tailwind CSS: Nanasi UI are built using Tailwind CSS.
- Flexible & composable: Nanasi UI components are built on top of a React UI
- [wip] Accessible. Nanasi UI components follow the WAI-ARIA guidelines specifications
and have the right
aria-*
attributes. - [wip] Dark Mode 😍: Most components in Nanasi UI are dark mode compatible.
By donating $5 or more you can support the ongoing development of this project. We'll appreciate some support. Thank you to all our supporters! 🙏 [Contribute]
To use Nanasi UI components, all you need to do is install the
react-nanasi
package:
yarn add react-nanasi
or
npm i react-nanasi
To start using the components,
Just import the component and use it as you would any other React component.
import { Button } from 'react-nanasi';
function Example() {
return <Button>I love Pineapples! </Button>;
}
- JavaScript Starter: wip
- TypeScript Starter: wip
- NextJS TypeScript Starter: wip
Feel like contributing? That's awesome! We have a contributing guide to help guide you.
Our docsite(wip) lives within separate repo. If you're interested in contributing to the documentation, check out the docsite contribution guide.
This project is licensed under the MIT License.
This project is a work in progress. As such, there are a few things that are missing. We're working on it! 🚧