http://www.uisdc.com/material-design-frameworks-top-9

谷歌推出的Material Design风格已见有一些APP UI采用,视觉和交互体验都很棒,对于想尝试这个风格但又不懂实现一些效果的前端设计师们,可以试试今天分享的9个目前流行的Material Design前端框架 >>>

这些前端框架的设计元素齐全,按钮、表单、布局及常用JS特效代码也有齐了,支持Responsive Design,还有的可以结合Bootstrap使用,相当不错,下面来看看介绍,并挑选一款你喜欢的Framework来制作你的新项目吧。

个别网站得搭梯子访问 :)

Materialize

Materialize 是一个响应式的前端框架,设计样式及组件元素丰富。

Material UI

(可能得搭梯子)

Material UI 和上面的框架差不多,另外值得一提就是它自带的响应式日期选择很棒哦。

MUI

MUI 是一个轻量级的Material Design框架,它的CSS和JS压缩版加起来不超过10KB,作者还提到可以用MUI的CSS来创建邮箱模板,支持流行的邮箱(如:Gmail,Apple Mail,Outlook等)

Daemonite

Daemonite ,轻量级。

LumX

(可能得搭梯子)

LumX 这个前端框架主要是使用了Angular JS,针对手机端有不错的体验,如果懂Angular JS的建议使用这个框架。

Framaterial

Framaterial 这个框架小编体验的时候,有的JS效果在桌面端感觉有点卡顿,动画不够流畅,但总体还是不错,有很丰富的组件元素。

Material Framework

Material Framework 这个前端框架有2组风格,一个是默认白色以及暗色调,缺点就是组件元素目前还不够多。

Material Foundation

如果你懂得使用Foundation,那么这个前端框架可以选择了,直接为你的Foundation换肤。但组件还是有点少了。

Material Design For Bootstrap

Material Design for Bootstrap 对于不想再去花时间了解新框架,并喜欢使用Bootstrap 的用户,那么你就用它吧。

【设计师快速建站的必备好文】

手把手教你搭建最流行的WordPress网站!
《新手也能做网站!教你搭建一个超酷的WORDPRESS博客》

风趣幽默的前端基础全科普!
《给设计师们的代码指南!HTML与CSS简介(一)》

响应式网站设计的神器推荐!
《最热门工具推荐!为响应式网站而生的40款栅格神器》

原文地址:speckyboy
译文地址:shejidaren

【优设网 原创文章 投稿邮箱:2650232288@qq.com】

================关于优设网================
“优设网uisdc.com“是国内人气最高的网页设计师学习平台,专注分享网页设计、无线端设计以及PS教程。
【特色推荐】
设计师需要读的100本书:史上最全的设计师图书导航:http://hao.uisdc.com/book/
设计微博:拥有粉丝量94万的人气微博@优秀网页设计 ,欢迎关注获取网页设计资源、下载顶尖设计素材。
设计导航:全球顶尖设计网站推荐,设计师必备导航:http://hao.uisdc.com
———————————————————–
想在手机上、被窝里获取设计教程、经验分享和各种意想不到的”福利”吗?
添加 优秀网页设计 微信号:【youshege】优设哥的全拼
您也可以通过扫描下方二维码快速添加:

超实用!9个目前流行的MATERIAL DESIGN前端框架的更多相关文章

  1. 轻量级 Material Design 前端框架 MDUI (纯html,css,与css框架跟react vue不冲突)

    MDUI 是一个轻量级的 Material Design 前端框架,对照着 Material Design 文档进行开发,争取 1:1 实现 Material Design 中的组件. 多主题支持 M ...

  2. 仿知乎app登录界面(Material Design设计框架拿来就用的TexnInputLayout)

    在我脑子里还没有Material Design这种概念,就我个人而言,PC端应用扁平化设计必须成为首选,手当其冲的两款即时通讯旺旺和QQ早就完成UI扁平化的更新,然而客户端扁平化的设计本身就存在天生的 ...

  3. Material UI – Material Design CSS 框架

    Material Design 是谷歌推出的全新的设计理念,采用大胆的色彩.流畅的动画播放,以及卡片式的简洁设计.Material Design 风格的设计拥有干净的排版和简单的布局,容易理解,内容才 ...

  4. Jquery之家5个顶级Material Design框架

    谷歌Material Design在如今的前端页面设计中非常流行.Material Design的设计风格向我们展示了一个简单而有内涵的现代UI设计方案. Material Design是如此的简洁美 ...

  5. 15个优秀的 Material Design(材料设计)案例

    Material Design (材料设计)是由谷歌创建和设计的一种设计语言,结合成功的设计的经典原则以及创新科技.谷歌的目标是开发一个设计系统,让所有的产品在任何平台上拥有统一的用户体验.全新的设计 ...

  6. Materialize - 响应式 Material Design 框架

    由谷歌创建和设计的 Material Design(材料设计)是一种设计语言,结合成功的设计的经典原则以及创新科技.谷歌的目标是开发一个设计系统,让所有的产品在任何平台上拥有统一的用户体验. Mate ...

  7. 基于Vue JS, Webpack 以及Material Design的渐进式web应用 [Part 1]

    基于Vue JS, Webpack 以及Material Design的渐进式web应用 [Part 1] 原文:基于Vue JS, Webpack 以及Material Design的渐进式web应 ...

  8. 一张图告诉你最流行的 7 个 JavaScript框架特点

    欢迎大家持续关注葡萄城控件技术团队博客,更多更好的原创文章尽在这里~~​ AngularJ.js                                                  由g ...

  9. 拟物设计和Angular的实现 - Material Design(持续更新)

    Material Design是Google最新发布的跨平台统一视觉设计语言.直接翻译是物质设计,但是我更倾向于使用"拟物设计"更为准确. 据谷歌介绍,Material Desig ...

随机推荐

  1. git pull refusing to merge unrelated histories

    1. 简介 最近的项目开发环境我换到实验室的机器上了,毕竟是台式机,速度杠杠的.于是出现了一个问题,台式机上面的代码我笔记上的代码同步的问题.于是想到了Git这个强大的工具.关于git的简介我就不说了 ...

  2. hostswap dcevm

    什么是dcevm dcevm(DynamicCode Evolution Virtual Machine)是java hostspot的补丁(严格上来说是修改),允许(并非无限制)在运行环境下修改加载 ...

  3. 使用 Prometheus 监控minio 性能指标信息&&docker-compose 方式运行

    minio server 已经支持Prometheus 了,对于系统的运行参数我们可以方便.实时的查看 运行使用docker-compose docker-compose 文件 version: &q ...

  4. 13机器学习实战之PCA(2)

    PCA——主成分分析 简介 PCA全称Principal Component Analysis,即主成分分析,是一种常用的数据降维方法.它可以通过线性变换将原始数据变换为一组各维度线性无关的表示,以此 ...

  5. 常用gui软件使用技巧

    xmind powerdesinger notepad++ firefox office ========================================= win10企业版安装 xm ...

  6. C# Monitor的Wait和Pulse方法使用详解

    [转载]http://blog.csdn.net/qqsttt/article/details/24777553 Monitor的Wait和Pulse方法在线程的同步锁使用中是比较复杂的,理解稍微困难 ...

  7. MEMS 硅麦资料收集

    MEMS 硅麦资料收集 PCM 和 I2S 协议的 MEMS Microphone PCM 协议在蓝牙方面比较多,一般都有 PCM 的接口. MEMS Microphone 更加的省电,更方便用于语音 ...

  8. Webpack 的 Tree Shaking

    为什么要使用 Tree Shaking? 当从某文件模块中导出(某一个或几个变量.函数.对象等),然而这个文件模块还有许多其它(我们这次并不需要)的导出,webpack会不管三七二十一简单粗暴的将整个 ...

  9. HBase启动后RegionServer自动挂原因及解决办法

    zookeeper在同步和管理集群时依赖节点系统时间,每隔一定周期zookeeper master会监测所有节点的连接状态.所以解决办法就是利用ntp对集群局域网进行时间同步. CentOS设置系统时 ...

  10. JS判断字符串是否为空或是否全为空格

    var test = " "; //为空或全部为空格 if (test.match(/^[ ]*$/)) { console.log("all space or empt ...