https://free.utcwiki.com/%E6%A8%A1%E6%9D%BF:ColorOps/doc/history?feed=atom
模板:ColorOps/doc - 版本历史
2026-06-24T01:42:16Z
本wiki上该页面的版本历史
MediaWiki 1.43.8
https://free.utcwiki.com/index.php?title=%E6%A8%A1%E6%9D%BF:ColorOps/doc&diff=209&oldid=prev
僵尸君呀：导入1个版本
2023-08-18T15:14:44Z
<p>导入1个版本</p>
<table style="background-color: #fff; color: #202122;" data-mw="interface">
<col class="diff-marker" />
<col class="diff-content" />
<col class="diff-marker" />
<col class="diff-content" />
<tr class="diff-title" lang="zh-Hans-CN">
<td colspan="2" style="background-color: #fff; color: #202122; text-align: center;">←上一版本</td>
<td colspan="2" style="background-color: #fff; color: #202122; text-align: center;">2023年8月18日 (五) 23:14的版本</td>
</tr><tr><td colspan="4" class="diff-notice" lang="zh-Hans-CN"><div class="mw-diff-empty">（没有差异）</div>
</td></tr>
<!-- diff cache key free_utcwiki_com:diff:1.41:old-208:rev-209 -->
</table>
僵尸君呀
https://free.utcwiki.com/index.php?title=%E6%A8%A1%E6%9D%BF:ColorOps/doc&diff=208&oldid=prev
2022年5月23日 (一) 03:28 Bot
2022-05-23T03:28:20Z
<p></p>
<p><b>新页面</b></p><div><noinclude>{{萌娘百科}}</noinclude><br />
== 简介 ==<br />
<br />
该模板包含数个操作颜色值的方法：<br />
<br />
* 颜色加深/减淡(操作明度)<br />
* 修改颜色饱和度<br />
* 反转颜色<br />
* 添加不透明度<br />
* 随机颜色<br />
* 混合两种颜色<br />
<br />
以及两个判断方法：<br />
<br />
* 判断颜色是否为亮色<br />
* 判断颜色是否为暗色<br />
<br />
== 用法 ==<br />
<br />
该模板所有方法都只支持传入这些格式的颜色值：hex颜色(井号加6位16进制数字)、hex简写颜色(井号加3位16进制数字)、rgb函数、rgba函数、hsl函数、hsla函数、css颜色关键字。<br />
<br />
除添加透明度以外，该函数的输出格式均为hex颜色。另外请注意：“Infobox”系列模板只支持hex颜色。<br />
<br />
以下示例中使用的{{tl|color_block}}模板用于展示颜色。<br />
<br />
=== 操作颜色的明度与饱和度 ===<br />
<br />
通过第一个参数进行控制。<br />
<br />
该方法的典型使用情景是在选定大家族模板的主要颜色后，利用该方法衍生出各部分(title、group、list等)的颜色。<br />
<br />
<pre><br />
{{ColorOps|属性符(可选) 操作符 操作值|颜色值}}<br />
</pre><br />
<br />
* 属性符：<br />
** 默认：反向的操作明度(也就是说，+是降低明度，-是增加明度。为了方便记忆你可以理解为默认是“颜色加深”和“颜色减淡”){{黑幕|你问为什么会设计得这么别扭？这个模板最开始只能操作这个属性}}{{黑幕|←说到底还是最开始没考虑扩展性}}<br />
** l：操作明度，明度增加则颜色泛白，反之泛黑<br />
** s：操作饱和度，饱和度增加颜色变得更加鲜艳，反之逐渐趋向于灰色<br />
* 操作符：+和-，可以理解为对应属性提高与降低<br />
* 操作值：1 ~ 100之间的整数，默认为10<br />
<br />
==== 栗子一 ==== <br />
{{example|<nowiki><br />
颜色加深(降低明度)前：{{color_block|#FF8040}}<br />
<br />
颜色加深(降低明度)后：{{color_block|{{ColorOps|+32|#FF8040}}}}<br />
<br />
提高明度前：{{color_block|#FF8040}}<br />
<br />
提高明度后：{{color_block|{{ColorOps|l+32|#FF8040}}}}<br />
</nowiki>|print}}<br />
<br />
==== 栗子二 ====<br />
{{example|<nowiki><br />
降低饱和度前：{{color_block|#FF8040}}<br />
<br />
降低饱和度后：{{color_block|{{ColorOps|s-80|#FF8040}}}}<br />
</nowiki>|print}} <br />
<br />
==== 栗子三 ====<br />
<br />
传入的原始值将作为加深和减淡的初始值和临界值。若想预览所有颜色，可以在第一个参数的位置使用<code>test:属性符</code>，如：<br />
<br />
{{example|<nowiki><br />
{{ColorOps|test:l|#FF8040}}<br />
</nowiki>|print}}<br />
<br />
{{example|<nowiki><br />
{{ColorOps|test:s|#FF8040}}<br />
</nowiki>|print}}<br />
<br />
注意，颜色预览虽然是整数倍的，但可选范围是0~100之间任意的。<br />
<br />
=== 反转 ===<br />
<br />
<pre><br />
{{ColorOps|reverse|颜色值}}<br />
</pre><br />
<br />
栗子：<br />
<pre><br />
反转前：{{color_block|#FF8040}}<br />
<br />
反转后：{{color_block|{{ColorOps|reverse|#FF8040}}}}<br />
</pre><br />
<br />
反转前：{{color_block|#FF8040}}<br />
<br />
反转后：{{color_block|{{ColorOps|reverse|#FF8040}}}}<br />
<br />
=== 添加不透明度 ===<br />
<br />
该处返回值使用css的rgba函数。不透明度范围为0到1。<br />
<br />
栗子：<br />
<pre><br />
添加前：{{color_block|red}}<br />
<br />
添加后：{{color_block|{{ColorOps|opacity|red|0.5}}}}<br />
</pre><br />
添加前：{{color_block|red}}<br />
<br />
添加后：{{color_block|{{ColorOps|opacity|red|0.5}}}}<br />
<br />
=== 混合 ===<br />
<pre><br />
{{ColorOps|mix|颜色1|颜色2|颜色1所占比重}}<br />
</pre><br />
<br />
栗子：<br />
{{example|<nowiki><br />
{{color_block|{{ColorOps|mix|red|blue}}}}<br />
</nowiki>|print}}<br />
<br />
=== 随机颜色 ===<br />
<br />
<pre><br />
{{ColorOps|random}} <!-- 完全随机 --><br />
{{ColorOps|random|最小值|最大值}} <!-- 设置rgb颜色范围，从0至255 --><br />
</pre><br />
<br />
栗子：<br />
<pre><br />
{{color_block|{{ColorOps|random}}}}<br />
{{color_block|{{ColorOps|random}}}}<br />
{{color_block|{{ColorOps|random}}}}<br />
{{color_block|{{ColorOps|random}}}}<br />
{{color_block|{{ColorOps|random}}}}<br />
<br />
{{color_block|{{ColorOps|random|150|250}}}}<br />
{{color_block|{{ColorOps|random|150|250}}}}<br />
{{color_block|{{ColorOps|random|150|250}}}}<br />
{{color_block|{{ColorOps|random|150|250}}}}<br />
{{color_block|{{ColorOps|random|150|250}}}}<br />
</pre><br />
{{color_block|{{ColorOps|random}}}}<br />
{{color_block|{{ColorOps|random}}}}<br />
{{color_block|{{ColorOps|random}}}}<br />
{{color_block|{{ColorOps|random}}}}<br />
{{color_block|{{ColorOps|random}}}}<br />
<br />
{{color_block|{{ColorOps|random|150|250}}}}<br />
{{color_block|{{ColorOps|random|150|250}}}}<br />
{{color_block|{{ColorOps|random|150|250}}}}<br />
{{color_block|{{ColorOps|random|150|250}}}}<br />
{{color_block|{{ColorOps|random|150|250}}}}<br />
<br />
== 判断颜色明暗 ==<br />
<br />
{{example|<nowiki><br />
{{#vardefine:color|{{ColorOps|random}}}}<br />
<br />
这是一个随机的颜色：{{color_block|{{#var:color}}}}，它是一个<br />
{{#if:{{ColorOps|isDark|{{#var:color}}}}<br />
|暗色<br />
|亮色<br />
}}<br />
</nowiki>}}<br />
{{#var:example-view}}<br />
{{Template:格式模板}}<br />
{{计算模板}}<br />
<includeonly>[[分类:辅助模板]][[分类:计算模板]]</includeonly><br />
<noinclude>[[Category:模板说明文件]]</noinclude></div>
Bot