微信UI设计之WeUI前端样式库

WeUI

WeUI 是一套同微信原生视觉体验一致的基础样式库，由微信官方设计团队为微信内网页和微信小程序量身设计，令用户的使用感知更加统一。包含button、cell、dialog、 progress、 toast、article、actionsheet、icon等各式元素

框架名称：WeUI 样式库
在线演示

下载地址

Sketch 源文件

如果你是设计师，可以下载这个WeUI 的 Sketch 源文件来设计新的微信小程序、H5网页等等。

文件格式：.Sketch
素材版权：免费
下载地址（7MB）： Github

下面来看看 WeUI 样式库的介绍：
图标的颜色、样式和微信原生的样式几乎一致，看不到有什么区别哦！

Flex 布局

使用 CSS Flex 属性定制的布局系统，轻松实现多栏自适应排版。
Panel 面板

Footer 页尾样式

提示样式

底部Tabbar

Navbar

WeUI页面层级

用于规范WeUI页面元素所属层级、层级顺序及组合规范。

本文转自：http://www.shejidaren.com/weui.html

微信UI设计之WeUI前端样式库相关推荐

UI设计和web前端哪个好学？
很多同学因为不了解UI设计和web前端究竟有啥联系和区别会非常迷茫,其实UI设计与Web前端联系还是比较紧密的,那么究竟UI设计和web前端哪个好学呢?一起和合肥学码思小编看看吧. UI设计都需要学习 ...
学习c语言还是web前端好,是该学UI设计还是Web前端开发呢？
UI设计和web前端学习哪个好?哪个比较有前景? 1.Web前端开发:通俗来讲,当你打开某个网站时,往往时间被那些炫酷的动态网页设计所吸引.但是,如果没有Web前端工程师,这些图片是不会动的.这样一个 ...
【blade的UI设计】理解前端MVC与分层思想
前言最近校招要来了,很多大三的同学一定按捺不住心中的焦躁,其中有期待也有彷徨,或许更多的是些许担忧,最近在开始疯狂的复习了吧这里小钗有几点建议给各位: ① 不要看得太重,关心则乱,太紧张反而表现不 ...
微信小程序第二战（样式库的引入使用数据渲染插入和玻璃面板设计）
微信小程序第二战学习引入和使用样式库学习使用数据渲染插入学习获取用户个人信息学习玻璃窗户面板设计 1.样式库引用(使用Vant Weapp)Vant Weapp.官方网站在平时工作时肯定是要 ...
Android Studio安卓开发-类微信UI设计
新建一个安卓空项目,语言采用Java,基于Android SDK11.0实现,使用虚拟设备Pixel 5 API 30. 实现顶部微信栏-layout_top.xml. 创建时选择LinearLayo ...
干货素材|UI设计中的字体样式的应用
无论你是做网页还是App设计,文字内容总是能占到整个版面将近80%的区域.因此理解字体与排版对UI设计师来说非常关键.你需要始终把内容的可读性放在首位去考虑和权衡你对字体与排版的选择. 字体样式字体 ...
1.3.3微信小程序WeUI.js网页开发样式库
目录 1 概述 2 使用方法 2.1 安装 2.2 开发 3 元素类型 3.1 Button 3.2 Cell 3.3 Dialog 3.4 Progress 3.5 Toast 3.6 Msg Pa ...
微信小程序：WeUI一个专为微信小程序设计的UI框架
WeUI是什么 WeUI 是一套同微信原生视觉体验一致的基础样式库.由微信官方设计团队为微信内网页和微信小程序量身设计,令用户的使用感知更加统一.它最初是为了给在微信端页面提供一致的视觉体验而开发开源 ...
微信网页开发样式库的使用
一.WeUI 是什么 WeUI 是一套同微信原生视觉体验一致的基础样式库,由微信官方设计团队为微信内网页和微信小程序量身设计,令用户的使用感知更加统一.在微信网页或小程序中使用 WeUI,有如下优势: ...

微信UI设计之WeUI前端样式库

微信UI设计之WeUI前端样式库相关推荐

最新文章

热门文章