Templat:Greater color contrast ratio/doc

Dari Wiki Javasatu
Revisi sejak 27 September 2023 11.02 oleh Adminjavasatu (bicara | kontrib) (←Membuat halaman berisi '{{Documentation subpage}} <!-- Please place categories where indicated at the bottom of this page and interwikis at Wikidata (see Wikipedia:Wikidata) --> This template determines the pair of colors with the larger contrast ratio: color1/color2 or color1/color3. This is useful for selecting a foreground/background color pair. For accessibility, [http://www.w3.org/TR/WCAG20/#visual-audio-contrast WCAG 2.0 AA guidelines] require a contrast ratio of 3 or larger...')
(beda) ← Revisi sebelumnya | Revisi terkini (beda) | Revisi selanjutnya → (beda)
Loncat ke navigasi Loncat ke pencarian

This template determines the pair of colors with the larger contrast ratio: color1/color2 or color1/color3. This is useful for selecting a foreground/background color pair. For accessibility, WCAG 2.0 AA guidelines require a contrast ratio of 3 or larger for large text, and 4.5 or larger for normal sized text. When used in the default mode, with color2 and color3 equal to white and black, the selected color pair will always have a contrast ratio greater than 4.58.

Examples[sunting sumber]

  • <span style="background:navy; color:{{Greater color contrast ratio|navy|white|black}}">Navy</span>Navy
  • <span style="background:red; color:{{Greater color contrast ratio|red|white|black}}">Red</span>Red
  • <span style="background:white; color:{{Greater color contrast ratio|white|white|black}}">White</span>White
  • <span style="background:black; color:{{Greater color contrast ratio|black|white|black}}">Red</span>Black
  • <span style="background:#005500; color:{{Greater color contrast ratio|#005500|#FFFFFF|#000000}}">#005500</span>#005500
  • <span style="background:#005500; color:#{{Greater color contrast ratio|005500|FFFFFF|000000}}">005500</span>005500
  • <span style="background:#CC5500; color:#{{Greater color contrast ratio|CC5500|FFFFFF|000000}}">CC5500</span>CC5500
  • <span style="background:#CC5500; color:#{{Greater color contrast ratio|CC5500|FFFFFF|000000|bias=1}}">CC5500</span>CC5500

Optional parameters[sunting sumber]

The bias parameter should be used with caution to ensure accessibility. As stated above, when used without a bias, and with color2 and color3 equal to white and black, the selected color pair will always have a contrast ratio greater than 4.58. A bias of 1.25, reduces the possible minimum to 4.0, which may not meet accessibility standards.