Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/vann-dev/kokoro
Lightweight UI Components for React
https://github.com/vann-dev/kokoro
component component-library components lighweight next nextjs react react-component react-components reactjs tailwind-components tailwind-ui tailwindcss tailwindcss-components-library tailwindcss-plugin template ui ui-ux ux vite
Last synced: 4 months ago
JSON representation
Lightweight UI Components for React
- Host: GitHub
- URL: https://github.com/vann-dev/kokoro
- Owner: Vann-Dev
- License: gpl-3.0
- Created: 2023-12-21T17:39:56.000Z (about 1 year ago)
- Default Branch: main
- Last Pushed: 2024-10-21T12:32:46.000Z (4 months ago)
- Last Synced: 2024-10-22T21:44:43.794Z (4 months ago)
- Topics: component, component-library, components, lighweight, next, nextjs, react, react-component, react-components, reactjs, tailwind-components, tailwind-ui, tailwindcss, tailwindcss-components-library, tailwindcss-plugin, template, ui, ui-ux, ux, vite
- Language: TypeScript
- Homepage: https://www.npmjs.com/org/kokoro-ui/
- Size: 3.17 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 11
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# @kokoro-ui
> Lightweight UI Components for React
## [See documentation](https://kokoro-ui.vercel.app)
## **Requirements**
- [**tailwindcss 3 or later**](https://tailwindcss.com/)
- [**react 18 or later**](https://reactjs.org/)
---
## **npm**
```
npm i @kokoro-ui/theme @kokoro-ui/color
```
---
## **pnpm**
```
pnpm add @kokoro-ui/theme @kokoro-ui/color
```
---
## **yarn**
```
yarn add @kokoro-ui/theme @kokoro-ui/color
```
---
## **Tailwind Setup**
**tailwind.config.js**
```js
const { color } = require("@kokoru-ui/color");
/** @type {import('tailwindcss').Config} */
module.exports = {
content: [
// ...
"./node_modules/@kokoro-ui/theme/dist/**/*.{js,ts,jsx,tsx}",
],
theme: {
extend: {},
},
plugins: [color({
primary: "#fff"
})],
};
```
**tailwind.config.ts**
```js
import type { Config } from 'tailwindcss'
import { color } from "@kokoro-ui/color";
const config: Config = {
content: [
// ...
"./node_modules/@kokoro-ui/theme/dist/**/*.{js,ts,jsx,tsx}",
],
theme: {
extend: {},
},
plugins: [color({
primary: "#fff"
})],
}
export default config
```