Contrast v2 : Techniques : Accessibility

Edit This Code

See Result

<style>
#cell1 {background-color: #ffffcc}
#cell2 {background-color: #00ff00; color:#ff0000;}
#cell3 {background-color: #000000; color:#ffffff;}
#cell4 {background-color: #990099}
</style>

<section>
<p>
<table>
<caption><h2>Examples of good and poor contrast</h2></caption>
<thead>
<tr><th scope="col">Good Contrast</th><th scope="col">Poor Contrast</th></tr>
</thead>
<tbody>
<tr>
<td id="cell1">It is much easier to achieve sufficient contrast by using dark text on a light background</td>
<td id="cell2">It is much easier to achieve sufficient contrast by using dark text on a light background</td>
</tr>
<tr>
<td id="cell3">It is much easier to achieve sufficient contrast by using dark text on a light background</td>
<td id="cell4">It is much easier to achieve sufficient contrast by using dark text on a light background</td>
</tr>
</tbody>
</table>
</p>
</<section>

Result

Check Accessibility

Code goes here