<p dir="auto">The contrast ratio of Bootstrap's default alert boxes do not conform to WCAG 2.0 standards.</p>
<p dir="auto">By using this tool: <a href="http://webaim.org/resources/contrastchecker/" rel="nofollow">http://webaim.org/resources/contrastchecker/</a> it can be shown that both AAA and AA levels aren't met for all alert boxes (.alert, .alert-danger, .alert-error, .alert-info, .alert-success).</p>
<p dir="auto">I have customised the alert boxes to suit my needs, however I felt I should mention my findings for your consideration.</p>
<p dir="auto"><a target="_blank" rel="noopener noreferrer nofollow" href="https://camo.githubusercontent.com/8af9bfaabba1e9f95a3c63c4a2bba8eba9a53cd6dcf576e630447acf2e571ce2/68747470733a2f2f662e636c6f75642e6769746875622e636f6d2f6173736574732f323033393333372f313034303134362f34393930386633362d306661642d313165332d386637662d3664366130313231333533622e504e47"><img src="https://camo.githubusercontent.com/8af9bfaabba1e9f95a3c63c4a2bba8eba9a53cd6dcf576e630447acf2e571ce2/68747470733a2f2f662e636c6f75642e6769746875622e636f6d2f6173736574732f323033393333372f313034303134362f34393930386633362d306661642d313165332d386637662d3664366130313231333533622e504e47" alt="alert-info" data-canonical-src="https://f.cloud.github.com/assets/2039337/1040146/49908f36-0fad-11e3-8f7f-6d6a0121353b.PNG" style="max-width: 100%;"></a></p>
<p dir="auto">Hello,</p>
<p dir="auto">For the AA level in WCAG2 : Using a contrast ratio of 3:1 for large text and 4,5:1 for small text and providing additional visual cues on focus for links or controls where color alone is used to identify them - <a href="http://www.w3.org/TR/2012/NOTE-WCAG20-TECHS-20120103/G183" rel="nofollow">http://www.w3.org/TR/2012/NOTE-WCAG20-TECHS-20120103/G183</a>. <a href="http://www.paciellogroup.com/blog/2012/05/whats-large-text-in-wcag-2-0-parlance/" rel="nofollow">http://www.paciellogroup.com/blog/2012/05/whats-large-text-in-wcag-2-0-parlance/</a></p>
<p dir="auto">For exemple, the warning alert box have a contrast of 2,5 (background-color: #FCF8E3; color: #C09853;).<br>
We should have at least (background-color: #FCF8E3; color: #A16B0F;).</p>
<p dir="auto">you can use contrast-a <a href="http://www.dasplankton.de/ContrastA/" rel="nofollow">http://www.dasplankton.de/ContrastA/</a> or the Juicy Studio: Colour Contrast Analyser <a href="https://addons.mozilla.org/en-US/firefox/addon/juicy-studio-accessibility-too/" rel="nofollow">https://addons.mozilla.org/en-US/firefox/addon/juicy-studio-accessibility-too/</a></p>