# MP-COLORUI 是基于 Taro 框架的组件库

[![GitHub stars](https://img.shields.io/github/stars/yinliangdream/mp-colorui?style=for-the-badge) ![GitHub forks](https://img.shields.io/github/forks/yinliangdream/mp-colorui?style=for-the-badge)](https://github.com/yinLiangDream/mp-colorui)

[![npm](https://img.shields.io/npm/dt/mp-colorui?style=for-the-badge) ![NPM](https://img.shields.io/npm/l/mp-colorui?style=for-the-badge) ![npm type definitions](https://img.shields.io/npm/types/mp-colorui?style=for-the-badge) ![GitHub package.json version](https://img.shields.io/github/package-json/v/yinliangdream/mp-colorui?style=for-the-badge)](https://github.com/yinLiangDream/mp-colorui)

## 特色

- 全部采用 TypeScript 编写，类型声明一目了然
- 丰富的配色方案，极具色彩表现力
- 丰富的组件库，应有尽有

## 使用方式

> 具体文档请查看：[MP-ColorUI 文档](https://yinliangdream.github.io/mp-colorui-doc/)
>
> 安装：`npm i mp-colorui`， `yarn add mp-colorui`

## 投票及建议

[![建议及投票](https://feathub.com/yinLiangDream/mp-colorui?format=svg)](https://feathub.com/yinLiangDream/mp-colorui)

## 小程序演示

![MP ColorUI](https://md-1255362963.cos.ap-chengdu.myqcloud.com/mpcolorui/coloruiqrcode.png)

## 使用案例

### 引入 `CSS` 文件

引入 `CSS` 需要在 `src` 目录下 `app.scss` 中引入样式

```js
@import "~mp-colorui/dist/style/index.scss";
```

### 引入组件

```jsx
import { ClAvatar } from "mp-colorui";

<ClAvatar shadow shape="round" size="large" />;
```