Show Output
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>Example of CSS3 Contrast Filter Effect</title> <style> img.bright { -webkit-filter: contrast(200%); /* Chrome, Safari, Opera */ filter: contrast(200%); } img.dim { -webkit-filter: contrast(50%); /* Chrome, Safari, Opera */ filter: contrast(50%); } /* Some CSS to beautify this example */ table td{ padding: 10px; text-align: center; } </style> </head> <body> <table> <tr> <td> <img src="/examples/images/parrot.png" alt="Parrot"> </td> <td> <img class="dim" src="/examples/images/parrot.png" alt="Parrot"> </td> <td> <img class="bright" src="/examples/images/parrot.png" alt="Parrot"> </td> </tr> <tr> <td>Original Image</td> <td>contrast(50%)</td> <td>contrast(200%)</td> </tr> </table> </body> </html>
