选择控件允许用户对选项进行选择。
本指南介绍了三种类型的选择控件。
- 复选框允许从一组选项中选择多个。
- 单选框允许从一组选项中选择单个。
- 开关用于切换选项的开启或关闭状态。

本指南介绍了三种类型的选择控件。

复选框允许用户从一组选项中选择多个。
若列表中有多个选项,使用复选框而非开关可以节省空间。
若只有单个选项或设置项,应使用开关,而非复选框。

亮色主题

暗色主题
开:500号色板,不透明度 100%
关:#000000,不透明度 54%
禁用:#000000,不透明度 26%

亮色主题下复选框在悬停、聚焦、按下、禁用及禁用且聚焦时的状态。
开:500号色板,不透明度 100%
关:#FFFFFF,不透明度 70%
禁用:#FFFFFF,不透明度 30%

暗色主题下复选框在悬停、聚焦、按下、禁用及禁用且聚焦时的状态。
开关用于切换单个设置项的状态。开关所控制的选项及其状态,应在对应的标签中明确标示。开关采用与单选框相同的视觉属性。
已弃用内置“开”和“关”文字的滑动开关。请改用此处展示的开关。

亮色主题

暗色主题
打开时的滑块手柄:500号色板,不透明度 100%
打开时的轨道:500号色板,不透明度 50%
关闭时的滑块手柄:灰色50,#FAFAFA,不透明度 100%
关闭时的轨道:#000000,不透明度 38%
禁用时的滑块手柄:灰色400,#BDBDBD,不透明度 100%
禁用时的轨道:#000000,不透明度 12%

亮色主题下开关在悬停、聚焦、按下、禁用及禁用且聚焦时的状态。
打开时的滑块手柄:200号色板,不透明度 100%
打开时的轨道:200号色板,不透明度 50%
关闭时的滑块手柄:灰色400,#BDBDBD,不透明度 100%
关闭时的轨道:#FFFFFF,不透明度 30%
禁用时的滑块手柄:灰色800,#424242,不透明度 100%
禁用时的轨道:#FFFFFF,不透明度 10%

暗色主题下开关在悬停、聚焦、按下、禁用及禁用且聚焦时的状态。
仅在以触控操作为主的设备上使用外侧径向反馈(涟漪效果),因为手指的触控面积可能会完全遮挡元素。桌面端使用鼠标指针时则无需此额外提示。

移动端的径向反馈(涟漪效果)

桌面端无径向反馈