Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/illacloud/illa-design
A fully responsive UI Library for React.
https://github.com/illacloud/illa-design
components design-system react responsive-web-design storybook typescript ui-components ui-design uikit
Last synced: 22 days ago
JSON representation
A fully responsive UI Library for React.
- Host: GitHub
- URL: https://github.com/illacloud/illa-design
- Owner: illacloud
- License: apache-2.0
- Created: 2021-10-27T06:40:45.000Z (about 3 years ago)
- Default Branch: beta
- Last Pushed: 2024-04-04T01:27:08.000Z (7 months ago)
- Last Synced: 2024-10-11T02:19:33.980Z (25 days ago)
- Topics: components, design-system, react, responsive-web-design, storybook, typescript, ui-components, ui-design, uikit
- Language: TypeScript
- Homepage: https://illacloud.github.io/illa-design/
- Size: 76.4 MB
- Stars: 326
- Watchers: 12
- Forks: 70
- Open Issues: 4
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- Contributing: CONTRIBUTING.md
- License: LICENSE
- Code of conduct: CODE_OF_CONDUCT.md
Awesome Lists containing this project
- awesome - illacloud/illa-design - A fully responsive UI Library for React. (TypeScript)
README
ILLA Design
Accelerate your internal tools development.
[](https://discord.gg/illacloud)
[](https://design.illafamily.com)
[](https://codecov.io/gh/illacloud/illa-design)
[](./LICENSE)
[](./CONTRIBUTING.md)
## ✨ Features
1. 🛠 **Made for React:** Ready-to-use component library for React.
2. 📝 **TypeScript Friendly:** Come with TypeScript typings out of the box and support with predictable static typings.
3. 📦 **High Productivity:** Easy and fast, import in 5 seconds.
4. 🎨 **Vibrant Design:** Beautifully designed components and powerful theming system supports custom themes to match
your brand, including light and dark mode.
5. 🌍 **Internationalization:** Each component was designed with i18n in mind and multiple languages are supported.
6. 📱 **Fully Responsive:** Perfectly adaptable with all the devices, desktops to mobiles.
## 💡 Components
You can review all components in Storybook.
[](https://design.illafamily.com)
## 🖥 Fast Try
You can quickly use ILLA Design on codesandbox.
[](https://codesandbox.io/s/illa-design-demo-r1qyy2?fontsize=14&hidenavigation=1&theme=dark)
## 🚀 Get Started
Step 1: Install
```bash
$ pnpm add @illa-design/react @emotion/react framer-motion
# or
$ npm i @illa-design/react @emotion/react framer-motion
```
Step 2: Use
```tsx
import { Tag } from '@illa-design/react';
const App = () => (
Hello ILLA
);
```
## ⌨️ Development
Step 1: Clone locally.
```bash
$ git clone https://github.com/illacloud/illa-design.git
$ cd illa-design
$ pnpm install
```
Step 2: Run.
```bash
$ pnpm storybook
```
Then your can open storybook in your browser.
## 💬 Community
Join ILLA Community to share your ideas, suggestions or questions and connect with other users and contributors.
Discussion
[](https://github.com/orgs/illacloud/discussions)
Hangout together!
[](https://discord.gg/illacloud)
## 🌱 Contributing
Thinking about contributing? All kinds of contributions to ILLA are greatly appreciated and welcomed! Check
out [Contributing Guide](./CONTRIBUTING.md) for details about how you can get involved.
## 🔥 We're Hiring
Looking for a passionate and creative team? We are actively hiring engineers for the following positions:
- Frontend Engineer
- Golang Engineer
Contact Us: [email protected]
## License
This project is [Apache License 2.0](./LICENSE).