Difference between revisions of "Template:Ensure AA contrast ratio"

From blackwiki
Jump to navigation Jump to search
imported>Rich Farmbrough
imported>Rich Farmbrough
Line 1: Line 1:
 
<includeonly>{{#if:{{{base|}}}|{{#ifexpr:{{#invoke:Color contrast|ratio|{{{base}}}|{{{other|}}}|error=21}} < 4.5 OR {{#invoke:Color contrast|ratio|{{{base}}}|black|error=0}} < 4.5 AND {{#invoke:Color contrast|ratio|{{{base}}}|white|error=0}} < 4.5|{{{category|}}}}}}}</includeonly><noinclude>
 
<includeonly>{{#if:{{{base|}}}|{{#ifexpr:{{#invoke:Color contrast|ratio|{{{base}}}|{{{other|}}}|error=21}} < 4.5 OR {{#invoke:Color contrast|ratio|{{{base}}}|black|error=0}} < 4.5 AND {{#invoke:Color contrast|ratio|{{{base}}}|white|error=0}} < 4.5|{{{category|}}}}}}}</includeonly><noinclude>
{{Documentation|content=
 
This template checks for compliance with [http://www.w3.org/TR/2014/NOTE-WCAG20-TECHS-20140916/G17 WCAG G17], i.e. that a background–foreground colour combination has got a contrast ratio of more than 4.5:1. It takes two arguments, the <code>base</code> colour value, and the tracking category, <code>category</code>, to place non-compliant transclusions in. A third parameter, <code>other</code>, is optional; the template will by default calculate the contrast ratio against black and white, on the assumption that it is used in conjunction with {{Tlx|Greater color contrast ratio}}.
 
  
Note: this is compliant with AAA for 18 point or 14 point bold text.
+
{{Documentation}}
  
{|class="wikitable" style="text-align: center;"
+
</noinclude>
|+ Contrast ratios
 
|-
 
! Rating !! Normal text !! 18 point or 14 point bold text
 
|-
 
| AA || '''4.5''' || 3
 
|-
 
| AAA || 7 || '''4.5'''
 
|}
 
 
 
== Examples ==
 
* {{#invoke:DemoTemplate|{{PAGENAME}}|base=navy|category=Test}}
 
* {{#invoke:DemoTemplate|{{PAGENAME}}|base=navy|other=|category=Test}}
 
* {{#invoke:DemoTemplate|{{PAGENAME}}|base=navy|other=navy|category=Test}}
 
* {{#invoke:DemoTemplate|{{PAGENAME}}|base=red|category=Test}}
 
* {{#invoke:DemoTemplate|{{PAGENAME}}|base=#CC5500|category=Test}}
 
* {{#invoke:DemoTemplate|{{PAGENAME}}|base=asdf|category=Test}}
 
}}
 
 
 
[[Category:Color conversion templates]]</noinclude>
 

Revision as of 03:05, 29 August 2015


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

Usage

This template checks for compliance with WCAG G17, i.e. that a background–foreground colour combination has got a contrast ratio of more than 4.5:1. It takes two arguments, the base colour value, and the tracking category, category, to place non-compliant transclusions in. A third parameter, other, is optional; the template will by default calculate the contrast ratio against black and white, on the assumption that it is used in conjunction with {{Greater color contrast ratio}}.

Note: this is compliant with AAA for 18 point or 14 point bold text.

Contrast ratios
Rating Normal text 18 point or 14 point bold text
AA 4.5 3
AAA 7 4.5

Examples

  • {{Ensure AA contrast ratio|base=navy|category=Test}}
  • {{Ensure AA contrast ratio|other=|base=navy|category=Test}}
  • {{Ensure AA contrast ratio|other=navy|base=navy|category=Test}} → Test
  • {{Ensure AA contrast ratio|base=red|category=Test}}
  • {{Ensure AA contrast ratio|base=#CC5500|category=Test}}
  • {{Ensure AA contrast ratio|base=asdf|category=Test}} → Test

See also