Module:Color contrast/doc
This is a documentation subpage for Module:Color contrast. It contains usage information, categories and other content that is not part of the original Module page. |
This module is subject to page protection. It is a highly visible module in use by a very large number of pages. Because vandalism or mistakes would affect many pages, and even trivial editing might cause substantial load on the servers, it is protected from editing. |
This Lua module is used on approximately 325,916 pages. To avoid large-scale disruption and unnecessary server load, any changes to this module should first be tested in its /sandbox or /testcases subpages. The tested changes can then be added to this page in one single edit. Please consider discussing any changes on the talk page before implementing them. |
Uses Lua: |
This module is used primarily by
- {{Color contrast ratio }}
- {{RGBColorToLum }}
- {{Color contrast conformance }}
- {{Ensure AAA contrast ratio }}
- {{Ensure AA contrast ratio }}
- {{Greater color contrast ratio }}
It is also used for tracking within
and for documentation in
The formulas used are stated in WCAG 2.x specifications. WCAG is the main guideline for creating accessible interfaces on the web.
Usage
To use this module, you may use one of the above listed templates or invoke the module directly
- To compute relative luminescence:
{{ColorToLum|color}}
or{{#invoke:Color contrast|lum|color}}
- To compute a contrast ratio between two colors:
{{Color contrast ratio|color1|color2|error=?}}
or{{#invoke:Color contrast|ratio|color1|color2|error=?}}
- To determine which of two colors (color2a and color2b) has the greater contrast ratio with a particular color (color1):
{{Greater color contrast ratio|color1|color2a|color2b}}
or{{#invoke:Color contrast|greatercontrast|color1|color2a|color2b}}
- To compute the contrast ratio between the background and text colors specified in a css style string:
{{#invoke:Color contrast|styleratio|css style statement string|default background color|default text color}}