设计 & CSS
# CSS收集器
- CSSFX (opens new window) 一键复制一些漂亮的CSS动画特效
- tympanus (opens new window) 收集了很多的特效demo的网站
- Easing Functions Cheat Sheet (opens new window) 指定参数随时间的变化率的缓动功能检查表
- 免费的渐变背景CSS3样式 | oulu.me (opens new window) 有180个美丽的线性CSS3渐变样式和图片
- You-need-to-know-css (opens new window) CSS的各种DEMO，很全
- CSS Tricks (opens new window) CSS Tricks是一个国外的优秀前端开发博客,主要分享使用CSS样式的技巧、经验和教程等的国外网站
# CSS文章
- css-tricks (opens new window) css技巧文章
- Creating Glow Effects with CSS (opens new window) The CSS box-shadow property is deceptively awesome.
- Flex 布局教程：实例篇 - 阮一峰的网络日志 (opens new window) Flex 布局教程：实例篇
- CSS3 transform属性 - 铭绘 - 博客园 (opens new window) CSS3 transform属性
# CSS工具
- 拟物CSS生成器 (opens new window) 新拟物态（Neumorphism）生成工具
- CSS渐变生成器 (opens new window)
- CSS3-Box Shadow(阴影)生成器 (opens new window)
- 贝塞尔曲线生成器 (opens new window)
- 花纹背景生成器 (opens new window)
- 花纹背景CSS库-pattern.css (opens new window)
- 3D字体 (opens new window) 生成3D字体的JS库
- animista (opens new window) CSS动画可视化工具
- CSS triangle generator (opens new window) 帮你快速用 css 做出三角形
- 在线字体提取工具,字体子集生成器 - 在线工具 - 字客网 (opens new window) 字客网字体子集生成器可以让用户抽出一个字体文件里想要的字，再组成精减的字体文件，十分适合制作网页字体。操作简单，快捷，只需输入想要抽取的字，之后一键生成。
# 🍀配色
- Open Color (opens new window) UI设计的颜色规范,看起来挺好看的
- 中国传统颜色手册 (opens new window)
- 中国传统颜色手册 (opens new window)
- coolors (opens new window) 帮你在线配色的网站 你能找到不少配色灵感
- colorhunt (opens new window) 另一个配色网站
- Hex Naw (opens new window) 测试你的配色或者sass变量，基于colorable.js
# 🍀设计导航站
- 创造师导航 (opens new window)
- 设计师网址导航 (opens new window)
- 5IUX设计师导航 | 设计综合导航 (opens new window)
- SDC设计师网址导航 - 学设计从这里开始！ (opens new window) 优设网站导航为设计师提供ps教程、UI设计、素材下载、高清图库、配色方案、用户体验、网页设计等全方位设计师网站导航指引。每周更新及时，是优秀设计联盟（SDC）旗下最实用、最专业、最全面、最好用的设计师导航！
# 🍀设计平台
- 站酷 (ZCOOL) - 设计师互动平台 - 打开站酷，发现更好的设计！ (opens new window) 站酷 (ZCOOL)，中国设计师互动平台。深耕设计领域十二年，站酷聚集了650万设计师、摄影师、插画师、艺术家、创意人，设计创意群体中具有较高的影响力与号召力。
# 🍀插画、图库（待整理）
undraw (opens new window) 一个免费的插图网站，可以在上面寻找合适的插图，用于商业用途。
uimovement (opens new window) 能从这个网站找到不少动画交互的灵感
awwwards (opens new window)是一个一个专门为设计精美的网站以及富有创意的网站颁奖的网站
dribbble (opens new window) 经常能在上面找到很多有创意好看的 gif 或者图片
Bēhance (opens new window) dribbble 是设计师的微博，Bēhance 是设计师的博客
designcap (opens new window) 在线海报设计
Flat UI 色表 (opens new window) Flat UI 色表
nord (opens new window) 北欧性冷淡风主题配色
Unsplash (opens new window) 提供免费的高清图片，并且提供API调用展示随机图片
Pexels (opens new window) 提供免费的高清图片
colorkitty (opens new window) 从你的图片中提取配色
undraw (opens new window) 一个免费的插图网站，可以在上面寻找合适的插图，用于商业用途。
cssicon (opens new window) 所有的 icon 都是纯 css 画的 缺点：icon 不够多
clippy (opens new window) 在线帮你使用 css clip-path 做出各种形状的图形
Lorem Picsum (opens new window) 提供免费的占位图
Canva 可画 (opens new window) 生成插画、封面、海报、头像等
# 🍀图库
- uigradients (opens new window) 渐变色生成工具
- freepik (opens new window) banner 图库
- 觅元素 (opens new window)一天免费下载十张 psd
- 搞定设计 (opens new window) 可以抠图
- vectorizer (opens new window) 真正的 png 转 svg 神器
- 花瓣 (opens new window)
- 虎克 (opens new window) Ps 学习教程
- beTheme (opens new window)
- UI 中国 (opens new window)
# 🍀图标库
- Iconfont-阿里巴巴矢量图标库 (opens new window) Iconfont-国内功能很强大且图标内容很丰富的矢量图标库，提供矢量图标下载、在线存储、格式转换等功能。阿里巴巴体验团队倾力打造，设计和前端开发的便捷工具
- icones (opens new window) 超强的图标库收藏站点，94个不同风格的图标集，89456个图标，提供一键复制Vue、React代码，或者下载源文件
- icomoon (opens new window) 矢量图标库
- Ikonate (opens new window) 提供免费的图标 icons
- remixicon (opens new window) 又一个提供免费图标 icons
- feather (opens new window) 免费的 icons
# 🍀交互设计
- 微交互 (opens new window) 里面收集了市面上很多很好的微交互例子 值得学习
- Little Big Details (opens new window) 同上，一个国外微交互汇集网站
- cruip (opens new window) 登录页的各种页面设计，可以免费下载模板
- Comixify (opens new window) 一个波兰团队做了非常好玩的工具，可以把视频自动转成漫画，上图是他们提供的 demo，效果很棒。
- taiko-web (opens new window) 太鼓达人网页版 只能说很 6
# 🍀产品、原型
- 产品大牛 (opens new window) 什么有很多完整的产品原型可以借鉴
- 磨刀 (opens new window) 快速出 ui 原型
# 🍀Logo
- Logojoy (opens new window) 使用 ai 做 logo 的网站，做出来的 logo 质量还不错。
- brandmark (opens new window) 另一个在线制作 logo 网站
- instant (opens new window) 又一个 logo 制作网站
- namecheap (opens new window)又一个 logo 制作网站
- logo-maker (opens new window) 又一个 logo 制作网站 这个更简单点 就是选模板之后微调
编辑 (opens new window)
上次更新: 2021/07/21, 16:38:42