Neumorphism - 在线制作轻拟物 UI 设计按钮

可以通过这个工具分解出新拟物化 UI 是如何设计的,此外它还能生成 CSS 代码并应用到网页上

新拟物化 UI 设计(Neumorphism / soft ui)在近段时间流行起来的,我们在 Dribbble 中搜索 Neumorphism 就有很多相关的新拟物化设计作品,这种效果一眼看上去感觉很美,很舒服,今天分享的这个 Neumorphism 在线生成新拟物化 UI 工具,可以通过这个工具分解出新拟物化 UI 是如何设计的,此外它还能生成 CSS 代码并应用到网页上。

Neumorphism - 在线制作轻拟物 UI 设计按钮-Npcink

新拟物介绍

Neumorphism - 在线制作轻拟物 UI 设计按钮-Npcink
新拟态 UI 风格与扁平、投影风格的对比

从上面这张对比图可以看出,扁平风格就像是一张纸贴在墙面上,投影风格像是浮在半空中,而新拟态风格则像是墙面上直接凸起了一块。

实现

新拟物化主要是通过阴影来实现的,通过阴影实现凸凹两种质感

Neumorphism - 在线制作轻拟物 UI 设计按钮-Npcink

例子

参考页底Demo

相关链接

下载权限

查看
  • 免费下载
    评论后下载
    登录后下载

  • {{attr.name}}:
您当前的等级为
您有每天免费下载所有资源次的特权,今日剩余 已取得下载权限
Designer

怎么在网页中调用Font Awesome图标?

2020-5-20 22:09:38

博客主题

NewsPaper - 新闻杂志WordPress主题

2019-11-30 7:10:24

⚠️
Npcink上的部份代码及教程来源于互联网,仅供网友学习交流,若您喜欢本文可附上原文链接随意转载。
无意侵害您的权益,请发送邮件至 link@baimu.org 或点击右侧 私信:Muze 反馈,我们将尽快处理。
0 条回复 A文章作者 M管理员
    暂无讨论,说说你的看法吧
个人中心
购物车
优惠劵
今日签到
有新私信 私信列表
搜索