Template:Color/doc: Difference between revisions
Dat Hack3r (talk | contribs) m Minor TemplateData edit |
Dat Hack3r (talk | contribs) m Better wording |
||
| (2 intermediate revisions by the same user not shown) | |||
| Line 1: | Line 1: | ||
{{High priority}} | {{High priority}} | ||
{{tlx|Color}} generates a stylized color box that displays a color name or value in that color alongside a matching swatch. The color can be specified as either a CSS color name (e.g., <code>royalblue</code>) or a hex triplet with the <code>#</code> prefix (e.g., <code>#4169e1</code>). The color value can be passed either as the first positional parameter or via {{para|color}}. The color box automatically chooses either a light or dark background to maximize contrast, ensuring a contrast ratio greater than 4.58 and exceeding the [https://www.w3.org/TR/WCAG22/#contrast-minimum WCAG 2.2 AA minimum] of at least 4.5 for normal-sized text. | |||
* {{tlx|color|royalblue}} → | |||
*: {{color|royalblue}} | |||
* {{tlx|color|#4169e1}} → | |||
*: {{color|#4169e1}} | |||
* {{tlx|color|khaki}} → | |||
*: {{color|khaki}} | |||
* {{tlx|color|#f0e68c}} → | |||
*: {{color|#f0e68c}} | |||
* {{tlx|color|<nowiki>color=royalblue</nowiki>}} → | |||
*: {{color|color=royalblue}} | |||
* {{tlx|color|<nowiki>color=#4169e1</nowiki>}} → | |||
*: {{color|color=#4169e1}} | |||
* {{tlx|color|<nowiki>color=khaki</nowiki>}} → | |||
*: {{color|color=khaki}} | |||
* {{tlx|color|<nowiki>color=#f0e68c</nowiki>}} → | |||
*: {{color|color=#f0e68c}} | |||
== TemplateData == | |||
<templatedata> | <templatedata> | ||
{ | { | ||
"params": { | "params": { | ||
"1": { | "1": { | ||
"label": " | "label": "Color", | ||
"description": "CSS name | "description": "CSS name or hex code of color", | ||
"example": "# | "example": "#4169e1, royalblue", | ||
"type": "string", | "type": "string", | ||
"default": "#000000" | "default": "#000000", | ||
"suggested": true, | |||
"aliases": [ | |||
"color" | |||
] | |||
} | } | ||
}, | }, | ||
"description": " | "description": "This template generates a stylized color box that displays a color name or value in that color alongside a matching swatch, automatically selecting a light or dark background to ensure the color name remains legible for all colors.", | ||
" | "format": "inline" | ||
} | } | ||
</templatedata> | </templatedata> | ||
Latest revision as of 02:26, 31 January 2026
 | This template is a high priority for maintenance as it is original to the OWOT Wiki and used in articles. As such, this template may contain bugs and it should be a top priority of template maintainers to quickly fix any issues that arise with it. Discuss breaking changes on the talk page before implementing them. |
{{Color}} generates a stylized color box that displays a color name or value in that color alongside a matching swatch. The color can be specified as either a CSS color name (e.g., royalblue) or a hex triplet with the # prefix (e.g., #4169e1). The color value can be passed either as the first positional parameter or via |color=. The color box automatically chooses either a light or dark background to maximize contrast, ensuring a contrast ratio greater than 4.58 and exceeding the WCAG 2.2 AA minimum of at least 4.5 for normal-sized text.
{{color|royalblue}}→- royalblue
{{color|#4169e1}}→- #4169e1
{{color|khaki}}→- khaki
{{color|#f0e68c}}→- #f0e68c
{{color|color=royalblue}}→- royalblue
{{color|color=#4169e1}}→- #4169e1
{{color|color=khaki}}→- khaki
{{color|color=#f0e68c}}→- #f0e68c
TemplateData
This template generates a stylized color box that displays a color name or value in that color alongside a matching swatch, automatically selecting a light or dark background to ensure the color name remains legible for all colors.
| Parameter | Description | Type | Status | |
|---|---|---|---|---|
| Color | 1 color | CSS name or hex code of color
| String | suggested |