该模板包含数个操作颜色值的方法:
以及两个判断方法:
该模板所有方法都只支持传入这些格式的颜色值:hex颜色(井号加6位16进制数字)、hex简写颜色(井号加3位16进制数字)、rgb函数、rgba函数、hsl函数、hsla函数、css颜色关键字。
除添加透明度以外,该函数的输出格式均为hex颜色。另外请注意:“Infobox”系列模板的left-column-color
属性只支持hex颜色(原因是其实现使用了过时的HTML属性bgcolor
)。
以下示例中使用的{{color_block}}模板用于展示颜色。
通过第一个参数进行控制。
该方法的典型使用情景是在选定大家族模板的主要颜色后,利用该方法衍生出各部分(title、group、list等)的颜色。
{{ColorOps|属性符(可选) 操作符 操作值|颜色值}}
颜色加深(降低明度)前:{{color_block|#FF8040}} 颜色加深(降低明度)后:{{color_block|{{ColorOps|+32|#FF8040}}}} 提高明度前:{{color_block|#FF8040}} 提高明度后:{{color_block|{{ColorOps|l+32|#FF8040}}}}
颜色加深(降低明度)前:
颜色加深(降低明度)后:
提高明度前:
提高明度后:
降低饱和度前:{{color_block|#FF8040}} 降低饱和度后:{{color_block|{{ColorOps|s-80|#FF8040}}}}
降低饱和度前:
降低饱和度后:
传入的原始值将作为加深和减淡的初始值和临界值。若想预览所有颜色,可以在第一个参数的位置使用test:属性符
,如:
{{ColorOps|test:l|#FF8040}}
{{ColorOps|test:s|#FF8040}}
注意,颜色预览虽然是整数倍的,但可选范围是0~100之间任意的。
{{ColorOps|reverse|颜色值}}
栗子:
反转前:{{color_block|#FF8040}} 反转后:{{color_block|{{ColorOps|reverse|#FF8040}}}}
反转前:
反转后:
该处返回值使用css的rgba函数。不透明度范围为0到1。
栗子:
添加前:{{color_block|red}} 添加后:{{color_block|{{ColorOps|opacity|red|0.5}}}}
添加前:
添加后:
{{ColorOps|mix|颜色1|颜色2|颜色1所占比重}}
栗子:
{{color_block|{{ColorOps|mix|red|blue}}}}
{{ColorOps|random}} <!-- 完全随机 --> {{ColorOps|random|最小值|最大值}} <!-- 设置rgb颜色范围,从0至255 -->
栗子:
{{color_block|{{ColorOps|random}}}} {{color_block|{{ColorOps|random}}}} {{color_block|{{ColorOps|random}}}} {{color_block|{{ColorOps|random}}}} {{color_block|{{ColorOps|random}}}} {{color_block|{{ColorOps|random|150|250}}}} {{color_block|{{ColorOps|random|150|250}}}} {{color_block|{{ColorOps|random|150|250}}}} {{color_block|{{ColorOps|random|150|250}}}} {{color_block|{{ColorOps|random|150|250}}}}
{{#vardefine:color|{{ColorOps|random}}}} 这是一个随机的颜色:{{color_block|{{#var:color}}}},它是一个 {{#if:{{ColorOps|isDark|{{#var:color}}}} |暗色 |亮色 }}
这是一个随机的颜色:,它是一个 亮色
|
|