基础样式

  • 默认状态

    按钮_默认状态
    普通按钮呈现标准样式，适用于常规交互场景。

  • 悬停状态

    按钮_悬停状态
    鼠标悬停时颜色加深或添加阴影，提升用户操作反馈。

  • 点击状态

    按钮_点击状态
    点击后产生轻微的动画效果（如缩放/颜色变化），增强交互体验。

交互反馈

  • 加载状态

    按钮_加载状态
    添加旋转图标（如.spinner）或文字提示，用于表示操作进行中。

  • 禁用状态

    按钮_禁用状态
    按钮变灰并去除点击效果，明确告知用户当前不可操作。

高级功能

  • 图标按钮

    图标_按钮
    通过图标替代文字（如.✅.⚙️），节省空间并提升视觉识别。

  • 下拉菜单按钮

    下拉_菜单_按钮
    点击后展开选项列表，适用于多选项选择场景。

扩展阅读

如需了解按钮的使用规范，请参阅：/components/buttons/usage
更多样式设计案例可查看：/components/buttons/styles