https://github.com/woozdesign/ui
An open-source design library for building simple, useful, and impactful design.
https://github.com/woozdesign/ui
design-system react typescript ui-kit ui-library woozdesign
Last synced: 21 days ago
JSON representation
An open-source design library for building simple, useful, and impactful design.
- Host: GitHub
- URL: https://github.com/woozdesign/ui
- Owner: woozdesign
- License: mit
- Created: 2023-09-17T02:37:54.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2024-10-31T03:46:24.000Z (6 months ago)
- Last Synced: 2024-10-31T04:24:42.773Z (6 months ago)
- Topics: design-system, react, typescript, ui-kit, ui-library, woozdesign
- Language: TypeScript
- Homepage: https://woozdesign.com
- Size: 4.95 MB
- Stars: 40
- Watchers: 0
- Forks: 2
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
[](https://design.woozlabs.com)
## 🖥 Environment Support
- Modern browsers
- Server-side Rendering
- [Electron](https://www.electronjs.org/)
| [
](http://godban.github.io/browsers-support-badges/)
Edge | [
](http://godban.github.io/browsers-support-badges/)
Firefox | [
](http://godban.github.io/browsers-support-badges/)
Chrome | [
](http://godban.github.io/browsers-support-badges/)
Safari | [
](http://godban.github.io/browsers-support-badges/)
Electron |
| ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Edge | last 2 versions | last 2 versions | last 2 versions | last 2 versions |
## 📦 Install
```bash
npm install @woozdesign/ui
```
```bash
yarn add @woozdesign/ui
```
```bash
pnpm add @woozdesign/ui
```
## 🔨 Usage
```jsx
import React from 'react';
import '@woozdesign/ui/styles.css';
import { Button, Layout } from '@woozdesign/ui';
const App = () => (
Button
);
```
## 💻 SSR
```jsx
'use client';
import React from 'react';
import { ThemeProvider } from '@woozdesign/ui';
import '@woozdesign/ui/styles.css';
export const RootStyleRegistry = ({ children }: React.PropsWithChildren) => {
return {children};
};
```
## Supported Components
Wooz Design offers a robust and diverse set of components to aid in creating interactive and dynamic user interfaces. Our library is continuously evolving, and we are committed to enhancing and expanding our component offerings.
For more in-depth information on the supported components, please refer to our detailed [documentation](https://design.woozlabs.com).
## TypeScript
`woozdesign` is written in TypeScript with complete definitions.
## ⌨️ Development
Clone locally:
```bash
$ git clone [email protected]:woozdesign/woozdesign-ui.git
$ cd @woozdesign/ui
$ npm install
$ npm start
```
## 🤝 Contributing [](http://makeapullrequest.com)
Read our [contributing guide](./docs/git/CONTRIBUTING.md) and let's build a better woozdesign together.
We welcome all contributions. Please read our [CONTRIBUTING.md](./docs/git/CONTRIBUTING.md) first. You can submit any ideas as [pull requests](https://github.com/woozlabs/woozdesign-ui/pulls) or as [GitHub issues](https://github.com/woozlabs/woozdesign-ui/issues). If you'd like to improve code, check out the [Development Instructions]() and have a good time! :)