塔斯娱乐资讯网

UI设计中按钮的5种类型一次讲清楚

做 UI 设计,按钮是你最先要搞懂的组件之一。别觉得简单,很多人工作两三年了还在乱用。
今天一次讲清楚👇
1️⃣ 主按钮(Primary Button) 页面中最重要的操作,比如「提交」「确认」「立即购买」。通常用品牌色填充,一个页面最多出现一个。
2️⃣ 次要按钮(Secondary Button) 重要性仅次于主按钮,比如「取消」「返回」。通常用描边样式或浅色填充,和主按钮搭配使用。
3️⃣ 幽灵按钮(Ghost Button) 只有边框没有填充,视觉存在感最弱。适合放在深色背景上,或者用在不需要强调的操作。
4️⃣ 文本按钮(Text Button) 没有边框和背景,看起来就像一段可点击的文字。适合辅助操作,比如「查看详情」「了解更多」。
5️⃣ 图标按钮(Icon Button) 只有图标没有文字,比如关闭、删除、收藏。节省空间但要注意图标的可识别性。
💡 核心原则:一个页面里按钮的视觉层级要分明,让用户一眼知道该点哪个。

📚下面这份《UIUX 学习指南》,是我花 1 年时间整理,萃取苹果、谷歌等大厂设计智慧搭建而成的:
• 体系完整又系统,从视觉、交互到用研、产品,覆盖 UI/UX 全链路
• 不管是零基础入门、中级进阶还是冲资深,都能精准适配
• 每天花 5~10 分钟,就能稳步搭建起专业认知框架
👇文末加入「UIUX 学习指南」,用每天 5~10 分钟的坚持,换取终身受用的“设计竞争力”。
你会发现,那些焦虑和迷茫,都在稳步提升中烟消云散。