UNPKG

@zebra-ui/color

Version:

两种风格可选择,对微信小程序和支付宝小程序做了单独处理,滑动更丝滑。

68 lines (47 loc) 1.67 kB
<p align="center"> <img alt="logo" src="https://assets-1256020106.cos.ap-beijing.myqcloud.com/zebra-color/title.png" width="320" style="margin-bottom: 10px;"> </p> <h1 align="center">ZebraColor</h1> <p align="center">全端兼容的轻量级颜色选择器。</p> <p align="center"> 🔥 <a href="https://color.zebraui.com/">zebraColor文档</a> </p> <p align="center"> 🚀 <a href="https://swiper.zebraui.com/">zebraSwiper轮播</a> &nbsp; &nbsp; 🚀 <a href="https://zebraui.com/" target="_blank">zebraUI组件库</a> </p> ## 介绍 zebraColor是一款兼容全端的颜色选择器,通常用于自定义颜色的场景。 ## 特性 - 全端兼容 - 微信小程序使用`wxs`,支付宝小程序使用`sjs`,滑动选择颜色时丝滑无卡顿。 ## 安装 ### npm方式 ```bash npm i @zebra-ui/color ``` ```js // pages.json { "easycom": { "^zebra-(.*)": "@zebra-ui/color/components/zebra-$1/zebra-$1.vue" }, "pages": [...], "globalStyle": {...} } ``` ### uni_modules方式 [插件市场](https://ext.dcloud.net.cn)直接导入即可 ## 手机预览 <div> <img alt="h5" src="https://assets-1256020106.cos.ap-beijing.myqcloud.com/zebra-color/code.png" style="width:200px;margin-top:20px;" /> </div> ## 预览 <div style="display:flex;flex-wrap:wrap;margin-top:30px;"> <img alt="gif" src="https://assets-1256020106.cos.ap-beijing.myqcloud.com/zebra-color/zebra-color-preview-gif.gif" width="320" style="margin:20px;" /> </div> ## 群 QQ群:947159437 ![image](https://assets-1256020106.cos.ap-beijing.myqcloud.com/zebra-swiper/zebra-swiper-group-code.png)