Template:Color sample

<span style="display:inline-block;width:1em;height:1em;border:1.62px solid black;background:{{{1}}};" title=""> 

Template documentation[view] [edit] [history] [purge]

Usage

• {{Color sample|red}} → <span style="display:inline-block;width:1em;height:1em;border:1.62px solid black;background:red;" title=""> 
• {{Color sample|#00FF00}} → <span style="display:inline-block;width:1em;height:1em;border:1.62px solid black;background:#00FF00;" title=""> 
• {{Color sample|#00FF00|description=green}} → <span style="display:inline-block;width:1em;height:1em;border:1.62px solid black;background:#00FF00;" title=""> 
  Adds a description of the color for screen reader users
• {{Color sample|{{Independent (politician)/meta/color}}}} → <span style="display:inline-block;width:1em;height:1em;border:1.62px solid black;background:Template:Independent (politician)/meta/color;" title=""> 
  (Instead of specifying a color directly, this example uses {{Independent (politician)/meta/color}}, which generates #DDDDDD.)

Note: When hovered over, the template shows the value used for color as a tooltip by default. This is also heard by a screen reader. An optional parameter, |description= can be used to change that to something more user-friendly, as shown in the third example.

See also

• Template:Swatch inline
• Template:Swatch
• List of colors

The above documentation is transcluded from Template:Color sample/doc. (edit | history)
Editors can experiment in this template's sandbox (create | mirror) and testcases (create) pages.
Please add categories to the /doc subpage. Subpages of this template.