| <svg xmlns="http://www.w3.org/2000/svg" width="0" height="0" version="1.1"> |
| <defs> |
| <filter id="xor" color-interpolation-filters="sRGB"> |
| <feColorMatrix type="matrix" values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 0.5 0" result="transp"/> |
| <feOffset dx="10" dy="10"/> |
| <feComposite in2="transp" operator="xor"/> |
| </filter> |
| </defs> |
| </svg> |
| <style> |
| li { |
| margin: 10px; |
| width: 160px; |
| height: 90px; |
| background-image: url(resources/reference.png); |
| display: block; |
| float: left; |
| transform:translateZ(0); |
| } |
| </style> |
| <ul> |
| <li style="filter: blur(3px)"/> |
| <li style="filter: brightness(0.5)"/> |
| <li style="filter: contrast(3)"/> |
| <li style="filter: drop-shadow(5px 5px 5px blue)"/> |
| <li style="filter: grayscale(0.5)"/> |
| <li style="filter: hue-rotate(180deg)"/> |
| <li style="filter: invert(1.0)"/> |
| <li style="filter: opacity(0.5)"/> |
| <li style="filter: saturate(10)"/> |
| <li style="filter: sepia(1.0)"/> |
| <li style="filter: url(#xor)"/> |
| </ul> |