← 返回 Web 词条Webaccent-color原生支持点选数值,样本实时变化
控件强调色
在 Web 上叫accent-color
CSS: accent-color
官方定义是「为某些元素生成的用户界面控件设置强调色」—— 那个「某些」是关键:目前浏览器只把它应用到 checkbox、radio、range 与 progress 四种。这四种是当前的实现范围,不是规范给死的边界。另外官方标注它是 Limited availability:「不属于 Baseline,因为在部分最广泛使用的浏览器里不生效」。
勾选框、单选钮、滑杆这类控件在选中或激活时用的那个主色。
- 勾选后那个蓝色
- 打上勾之后变的那个色
- 小圆点选中变的颜色
- 控件强调色
- 强调色
- 点缀色
示例
accent-color: #7C7CF8;
其他平台的相似实现
iOS原生支持
tint异名官方描述是「设置这个视图内的着色颜色」。
看 iOS 视角 →Android需自己实现
该平台没有原生实现没有一个「设置控件强调色」的对应属性。
看 Android 视角 →使用规范
什么时候用
- 表单控件要跟随品牌色,又不想逐个重画时
- 同一屏里要用颜色区分两组控件的语义时
什么时候别用
- 想改的是文字或背景颜色 → 那是前景色与背景色
- 指望它统一改掉全部控件外观 —— 各端覆盖范围差得很远