Template:Color/doc

Usage

{{color|<color>|<text>}}

Sets the color of <text> to <color>, where the format of <color> is as follows :

• A color keyword word.

  The existing keywords are as follows:

• transparent keyword, which was a virtual color in the old CSS color standard due to lack of opacity support, but starting from version three, it is shorthand for the transparent color rgba(0, 0, 0, 0).
• currentColor keyword, primarily used for other color properties (such as background color, border color) to use the color color of the current or parent element, but can also be used here to inherit the color of the parent element.
• RGB mode: This mode mixes red, green, and blue colors in proportion, written in two ways (using R, G, B to represent the proportions of red, green, and blue):
  • #RRGGBB / #RGB, where all colors can only be filled with two or one hexadecimal integer values, calculated based on the actual value and the ratio to 255 (FF).
  • • All colors must either use two hexadecimal integer values (in which case the actual value is that value), or use one hexadecimal integer value (in which case the actual value is calculated as two identical digit values, for example, #CBA would be calculated as #CCBBAA).
  • rgb(RR, GG, BB), where all colors can either be two hexadecimal integer values, calculated based on the actual value and the ratio to 255 (FF), or directly filled in percentage ratios (0% to 100%, only integer values allowed, same here) (for example, rgb(100%, 0%, 20%)).
• HSL mode: This mode calculates colors using three parameters: hue, saturation, and lightness, where:
  • Hue uses unitless angles, with integer values, calculated by taking the remainder after dividing by 360, representing colors distributed around the circumference of a circle (for example, 0 represents red, 120 represents green, 240 represents blue).
  • Saturation uses percentage ratios, with higher values representing purer colors, while lower values become increasingly gray.
  • Lightness uses percentage ratios, with higher values leaning towards white, and at 100%, regardless of hue and saturation, the color is pure white; lower values lean towards black, with 0% being pure black.
  The format looks like hsl(0, 100%, 50%), etc.
• RGBA and HSLA modes: These modes are extensions of the above two modes, with the key point being the addition of a new alpha channel to support transparency. The extended formats are as follows:

  RGBA

  • #RRGGBBAA / #RGBA, where the alpha channel has the same number of digits as the other colors, with the alpha channel calculated the same way as the other colors (for example, #CBA9 would be calculated as #CCBBAA99).

  • rgba(RR, GG, BB, AA), where the alpha channel has the same number of digits as the other colors, which can either be two hexadecimal integer values or percentage ratios.

  HSLA

  The format looks like hsla(0, 100%, 50%, 37%)

  Lower alpha values represent more transparency, with 0 / 00 / 0% being fully transparent, and higher values representing less transparency, with F / FF / 100% being fully opaque (the RGB and HSL modes can be understood as having an alpha value of 100%).

Note: This template can only be used for inline content and cannot be used across lines!

See Also

• Help: Color List