推荐10个高颜值小程序开源UI库
大家好，我是Echa。
由于昨天小编发布一篇关于适合接私活的小程序开源项目相关优质的干货文章：推荐16个适合接私活的小程序开源项目，有兴趣的粉丝们看看这篇。结果陆陆续续小编收到粉丝们的私信反馈有没有针对小程序开发相关开源漂亮火热的UI库呢？这样的话，接私活搞副业更加得心应手了。为了粉丝们多接私活，多挣钱，提高生活品质。小编不能耽误大家发财，赶紧大脑高速运转安排上。另外，有接私活搞副业能力的粉丝们，可以私信小编回复：接私活。获取适合接私活合集系列的优秀开源项目，助你接私活得心应手。
今天小编给大家分享10个Github上非常火的小程序开源UI库，个个都靓，希望大家喜欢。
创作不易，喜欢的老铁们加个关注，点个赞，打个赏，后面会持续更新干货，速速收藏，谢谢！你们的一个小小举动就是对小编的认可，更是创作的动力。
全文大纲
- WeUI - 由微信官方设计团队为微信 Web 开发量身设计
- Vant WeApp - 是有赞移动端组件库 Vant 的小程序版本
- iView Weapp - 是由 TalkingData 发布的组件库
- ColorUI - 鲜亮的高饱和色彩，专注视觉的小程序组件库
- Wux Weapp - 是一套组件化、可复用、易扩展的微信小程序 UI 组件库
- TaroUI - 是由 京东·凹凸实验室 倾力打造的多端开发解决方案
- Lin UI - 是由林间有风团队精心打造的一套微信小程序组件库
- MinUI - 是基于微信小程序自定义组件特性开发而成的一套简洁、易用、高效的组件库
- uViewUI - 是uni-app生态优秀的UI框架，全面的组件和便捷的工具会让你信手拈来，如鱼得水
- Touch WX - 是一套完全免费的微信小程序开发框架
在线体验：https://weui.io/
Github：https://github.com/Tencent/weui-wxss
WeUI 是一套同微信原生视觉体验一致的基础样式库，由微信官方设计团队为微信内网页和微信小程序量身设计，令用户的使用感知更加统一。包含 button、cell、dialog、 progress、 toast、article、actionsheet、icon 等各式元素。
随着小程序的普及，微信也有很多内部小程序在开发，每个小程序都需要从零到1进行开发设计，而这个过程中，有大量的 UI 交互是重复的，另外，微信内部已经有一套H5版本的 WeUI 样式库。综合考虑，我们基于 WeUI 样式库开发了小程序版本的 UI 组件库，在内部多个小程序项目已经使用 OK 的情况下，我们把这套组件库开源让外部开发者也可以使用
如下图：
Vant Weapp
官网地址：https://youzan.github.io/vant-weapp/#/theme
Github： https://github.com/youzan/vant-weapp
Vant 是一个轻量、可靠的移动端组件库，于 2017 年开源。
目前 Vant 官方提供了 Vue 2 版本、Vue 3 版本和微信小程序版本，并由社区团队维护 React 版本和支付宝小程序版本。
小程序基于 Shadow DOM 来实现自定义组件，所以 Vant Weapp 使用与之配套的 css 变量 来实现定制主题。链接中的内容可以帮助你对这两个概念有基本的认识，避免许多不必要的困扰。
CSS 变量 的兼容性要求。对于不支持 CSS 变量 的设备，定制主题将不会生效，不过不必担心，默认样式仍会生效。
如下图：
iView Weapp
官网地址：https://weapp.iviewui.com/
Github： https://github.com/TalkingData/iview-weapp
iView Weapp 是一套高质量的微信小程序 UI 组件库。
在开始使用 iView Weapp 之前，你需要先阅读 微信小程序自定义组件 的相关文档。
如下图：
ColorUI
官网地址：http://docs.xzeu.com/
Github： https://github.com/weilanwl/ColorUI
ColorUI是一个css库！！！在你引入样式后可以根据class来调用组件，一些含有交互的操作我也有简单写，可以为你开发提供一些思路。
鲜亮的高饱和色彩，专注视觉的小程序组件库
如下图：
wux-weapp
官网地址：https://wuxui.com/
Github： https://github.com/wux-weapp/wux-weapp
wux-weapp 是一套组件化、可复用、易扩展的微信小程序 UI 组件库
- UI 样式可配置，拓展灵活，轻松适应不同的设计风格
- 60+ 丰富的组件，能够满足移动端开发的基本需求
如下图：
TaroUI
官网地址：https://taro-ui.jd.com/
Github： https://github.com/NervJS/taro-ui
Taro 是由 京东·凹凸实验室 倾力打造的多端开发解决方案。现如今市面上端的形态多种多样，Web、ReactNative、微信小程序等各种端大行其道，当业务要求同时在不同的端都要求有所表现的时候，针对不同的端去编写多套代码的成本显然非常高，这时候只编写一套代码就能够适配到多端的能力就显得极为需要。
使用 Taro，我们可以只书写一套代码，再通过 Taro 的编译工具，将源代码分别编译出可以在不同端（微信小程序、H5、RN等）运行的代码。
特性
多端适配：一套组件可以在微信小程序 / H5 / 百度小程序 等多端适配运行
组件丰富：提供丰富的基础组件，覆盖大部分使用场景，满足各种功能需求
按需引用：可按需使用独立的组件，不必引入所有文件，可最小化的注入到项目中
多套主题：提供默认的蓝色主题、红色主题以及自定义主题，后期会新增渐变色主题
如下图：
Lin UI
官网地址：https://doc.mini.talelin.com/
Github： https://github.com/TaleLin/lin-ui
Lin UI是由林间有风团队精心打造的一套微信小程序组件库，组件丰富、设计优美，并且拥有完整的商业案例，是您开发微信小程序的不二选择。
在如今这个移动互联网时代，技术创新将带来商业模式的完全颠覆，伴随着小程序的诞生，移动互联网行业也迎来了新一波的浪潮。
无数大小公司纷纷开始开发自己的小程序产品，前端的技术栈要求里也新增了 微信小程序 这项技能。
另一方面，软件开发的过程中，部分功能或视图的实现是一个重复性的工作，微信小程序从诞生到现在，不过两年时间（2017/1/09 ~ 2019/2/12），生态圈对比 Vue, React 来说实在过于单调， 而且很少有在设计和实用性上都很突出的产品，能够在实际开发中帮助到开发者的产品更是屈指可数。
所以，我们在深思熟虑后，决定要动手设计并开发一个与小程序相匹配的组件库。与其他组件库不同的是，我们除了提供基本的组件外，还会提供 wxs模块 、高级组件 、 电商组件模块 等等。 例如，在电商项目里常用的 SKU联动选择 ，城市选择器 等。不过，为了尽快发布与开发者们见面，我们先完成了基本的组件部分，剩余的高级内容将在当前版本稳定后，提上日程。
特性
简单易用
组件采用微信小程序的原生语法编写，只需要熟悉初级的 html 、 CSS 、 JAVAScript 和 微信小程序 相关知识就能上手开发，同时既可以一次性加载所有的代码，也可以选择只加载使用到的某些组件的代码。
规范统一
遵循统一的 设计规范 ，接口标准 和 事件冒泡机制 ，减少开发者查阅文档的时间成本，提升开发效率。
文档丰富
为了能让更多开发者接触之初，就能够熟练的用Lin-UI开发自己的小程序应用，我们对每个组件的 属性 、 事件 、用法 、和 案例 上都做了详尽的描述。
扩展性强
支持 按需引入 和 自定义的主题色 ，生成多种风格，满足个性化产品需求；同时还具有很强的 扩展性 ，轻松实现组件的二次开发。
支持第三方库框架
支持第三方框架，taro，mpvue。
如下图：
MinUI
官网地址：https://meili.github.io/
Github：https://github.com/meili/min-cli
MinUI 基于规范的小程序 UI 组件库，轻量、易用、工具化。
Min 是一套面向小程序的开发环境，由蘑菇街前端开发团队提供和维护。目前，我们开源了它面向小程序自定义组件的部分（后续还会陆续开源其他能力），结合微信开发者工具，对组件的 开发 和 使用，Min 会让你感到优雅和高效。而 MinUI，就是基于 Min 平台产出的一套 UI 组件库，同时也是 “蘑菇街女装精选” 小程序 （小程序总榜前 3 位） 在应用的 UI 组件库。
授人以渔，基于 Min 提供的开发赋能，和 MinUI 组件库实践的参考，不同小程序的开发者，可以快速建立起符合其自身需求的组件化体系。
如下图：
uView UI
官网地址：https://v1.uviewui.com/
Github：https://github.com/umicro/uView
uView UI，是uni-app生态优秀的UI框架，全面的组件和便捷的工具会让你信手拈来，如鱼得水。
uni-app在2018年初发布以来，一直蓬勃发展，一派欣欣向荣，社区也是人声鼎沸，众望所归。
因此，uView应运而生，uView的目标是成为uni-app生态最优秀的UI框架。
关于uView的取名来由，首字母u来自于uni-app首字母，uni-app是基于Vue.js，Vue和View(延伸为UI、视图之意)同音，同时view组件uni-app中 最基础，最重要的组件，故取名uView，表达源于uni-app和Vue之意，同时在此也对它们表示感谢。
适用领域
uView是uni-app生态专用的UI框架，uni-app 是一个使用 Vue.js 开发所有前端应用的框架，开发者编写一套代码， 可发布到IOS、Android、H5、以及各种小程序(微信/支付宝/百度/头条/QQ/钉钉)等多个平台(引言自uni-app网)。
四大利器，为您保驾护航
- 指南：涵盖uniapp各个方面，给开发者方向指导和设计理念，让您茅塞顿开，一马平川
- 组件：众多组件覆盖开发过程的各个需求，组件功能丰富，多端兼容。让您快速集成，开箱即用
- 工具库：众多的贴心小工具，是您开发过程中召之即来的利器，让您飞镖在手，百步穿杨
- 布局：收集众多的常用页面和布局，减少开发者的重复工作，让您专注逻辑，事半功倍
如下图：
Touch WX
Github：https://github.com/umicro/uView
Touch WX 是一套完全免费的微信小程序开发框架，包含丰富的UI控件用于官方组件的补充。
1、组件扩充：
增加了30多种常用的组件用于官方组件的补充。
2、功能扩充：
兼容阿里的iconfont图标库，海量矢量图标随意使用；补充了常用样式库、支持less语法、支持全局配置主题色等
3、开发体验改善：
四文件方式改为单文件方式，通过VSCode编辑器+插件的方式开发，拥有web开发体验；
4、小程序转为H5应用：
可以与H5开发框架Touch UI工程相互转换，发布成webApp。开发一套代码，拥有两套应用。
这套框架的原理是：
将Touch WX工程中所写的代码进行编译，直接输出为微信小程序工程原始代码。扩充的30多种组件，完全是基于小程序官方的自定义组件机制实现（row&col除外）。
所以它支持小程序的全部语法，怎么开发小程序，就怎么开发Touch WX。
不过因为是单文件的开发方式，在文件的代码结构上稍有不同。请注意这一点。
这样好处在于：
1、开发者迁移成本很小。
可以轻松的将已有的小程序移植为Touch WX工程，来使用它的扩展能力；
2、便于排查错误。
当遇到问题时，开发者也可以随时查看输出的小程序原始代码来定位问题所在。不会搞不清楚到底是框架问题还是自己代码的问题；
3、按需编译
由于小程序对体积有限制，在使用框架开发时，只有使用到的组件才会编译输出为小程序源码。没用到的不会输出。
4、不会对框架产生依赖。
以后不想用了这套框架，可以直接对已经输出的小程序工程进行维护。
如下图：
