https://github.com/kodepandaid/zenbu-ui
Don't waste your time building UI component. Just use Zenbu UI for easier developer life.
https://github.com/kodepandaid/zenbu-ui
react-components react-ui tailwindcss uikit
Last synced: 4 months ago
JSON representation
Don't waste your time building UI component. Just use Zenbu UI for easier developer life.
- Host: GitHub
- URL: https://github.com/kodepandaid/zenbu-ui
- Owner: KodepandaID
- License: mit
- Created: 2021-05-27T04:06:05.000Z (about 5 years ago)
- Default Branch: main
- Last Pushed: 2022-03-07T15:38:51.000Z (about 4 years ago)
- Last Synced: 2025-07-09T11:07:22.592Z (11 months ago)
- Topics: react-components, react-ui, tailwindcss, uikit
- Language: TypeScript
- Homepage: https://zenbu-ui.com
- Size: 11.3 MB
- Stars: 0
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Funding: .github/FUNDING.yml
- License: LICENSE
Awesome Lists containing this project
README
Zenbu UI
Don't waste your time to build UI component.
## Features
- Unstyled, you have the freedom to use any design system in the world. The basic style of Zenbu UI is a plain design.
- Utility props, you can customize the design with the use of utility props not with CSS.
- Theming, you can customize the specific component with context.
- Accessible, following the WAI-ARIA guidelines specifications and support keyboard navigation, and screen reader.
- Semantic, following the Semantic HTML guideline specifications.
## Introduction
The main mission of Zenbu UI is a provide the easiest way to build a website. Sometimes dealing with CSS waste your time, and it's not simple to use CSS for some people. Zenbu UI provides you the convenience of applying your design system without CSS, just using the props.
## Installing Zenbu-UI
```sh
$ yarn add @zenbu-ui/react
# or
$ npm i @zenbu-ui/react
```
## Usage
1. Zenbu UI using tailwind as utility css. First, you must copy file ```tailwind.config.js``` to your project folder then generate the CSS with the command:
```bash
npx tailwindcss -o your-project-folder -c ./tailwind.config.js --minify
```
2. Wrap your component with Provider and import the css:
```typescript
import 'your-project-folder/style.css'
```
## Documentation
For more information please read the [documentation](https://zenbu-ui.com).
## Support Zenbu UI
If this project can help you and you like it you can be my sponsor. You can sponsor me for $5 or more. We'll appreciate some support. Thank you to all our supporters! 🙏 [Contribute](https://opencollective.com/zenbu-ui).
## License
MIT © [Yudha Pratama Wicaksana](https://twitter.com/lordaur)