按钮

按钮是用户操作的主要视觉指示器。

原则

面向行动：按钮应明确传达它们会触发某种操作。

清晰的反馈：按钮的外观必须在不同的互动状态（悬停、按压、聚焦）下发生明显变化，以便提供即时反馈。

一致：所有按钮都应采用相同的核心视觉语言，以便用户能够立即识别。

灵活：按钮组件应能适应常见变体（例如包含图标和不同尺寸），同时不影响一致性。

使用和放置

按钮应放置在与其相关的内容附近。它们可以单独放置，也可以与其他组件（例如卡片和列表）一起放置。

check_circle

正确做法

使用逐步披露来显示相关性较低的操作。

cancel

错误做法

使用过多的按钮让用户感到困惑。

check_circle

正确做法

使用按钮提示用户执行操作。或者，为静态元素使用标题 chip。

cancel

错误做法

将按钮用作静态装饰元素。

解剖学

自定义

按钮包含默认变体和大型变体，以及每种变体的默认状态、焦点状态和按下状态。 图标可用于增强按钮的强调效果、清晰度和识别度。按钮大小有助于强调重要性。