filters.css

.as-protanopia {
	-webkit-filter: url(filters.svg#protanopia);
	   -moz-filter: url(filters.svg#protanopia);
	    -ms-filter: url(filters.svg#protanopia);
	     -o-filter: url(filters.svg#protanopia);
	        filter: url(filters.svg#protanopia); /* Firefox 3.5+ */

}
.as-deuteranopia {
	-webkit-filter: url(filters.svg#deuteranopia);
	   -moz-filter: url(filters.svg#deuteranopia);
	    -ms-filter: url(filters.svg#deuteranopia);
	     -o-filter: url(filters.svg#deuteranopia);
	        filter: url(filters.svg#deuteranopia); /* Firefox 3.5+ */

}
.as-tritanopia {
	-webkit-filter: url(filters.svg#tritanopia);
	   -moz-filter: url(filters.svg#tritanopia);
	    -ms-filter: url(filters.svg#tritanopia);
	     -o-filter: url(filters.svg#tritanopia);
	        filter: url(filters.svg#tritanopia); /* Firefox 3.5+ */

}
.as-monochromacy {
	-webkit-filter: url(filters.svg#monochromacy);
	   -moz-filter: url(filters.svg#monochromacy);
	    -ms-filter: url(filters.svg#monochromacy);
	     -o-filter: url(filters.svg#monochromacy);
	        filter: url(filters.svg#monochromacy); /* Firefox 3.5+ */

}
.as-enhance-r {
	-webkit-filter: url(filters.svg#enhance-r);
	   -moz-filter: url(filters.svg#enhance-r);
	    -ms-filter: url(filters.svg#enhance-r);
	     -o-filter: url(filters.svg#enhance-r);
	        filter: url(filters.svg#enhance-r); /* Firefox 3.5+ */

}
.as-enhance-g {
	-webkit-filter: url(filters.svg#enhance-g);
	   -moz-filter: url(filters.svg#enhance-g);
	    -ms-filter: url(filters.svg#enhance-g);
	     -o-filter: url(filters.svg#enhance-g);
	        filter: url(filters.svg#enhance-g); /* Firefox 3.5+ */

}

filters.svg

<svg xmlns='http://www.w3.org/2000/svg'>
	<filter id='protanopia'>
		<feColorMatrix type='matrix' values='0.56667 0.43333 0.00000 0 0 0.55833 0.44167 0.00000 0 0 0.00000 0.24167 0.75833 0 0 0 0 0 1 0'/>
	</filter>
	<filter id='deuteranopia'>
		<feColorMatrix type='matrix' values='0.4251 0.6934 -0.1147 0 0 0.3417 0.5882 0.0692 0 0 -0.0105 0.0234 0.9870 0 0 0 0 0 1 0'/>
	</filter>
	<filter id='tritanopia'>
		<feColorMatrix type='matrix' values='0.95000 0.05000 0.00000 0 0 0.00000 0.43333 0.56700 0 0 0.00000 0.47500 0.52500 0 0 0 0 0 1 0'/>
	</filter>
	<filter id='monochromacy'>
		<feColorMatrix type='matrix' values='0.33 0.33 0.33 0 0 0.33 0.33 0.33 0 0 0.33 0.33 0.33 0 0 0 0 0 1 0'/>
	</filter>
	<filter id='monochromacy'>
		<feColorMatrix type='matrix' values='1.00 0.00 0.00 0 0 0.00 1.00 0.00 0 0 1.00 0.00 0.00 0 0 0 0 0 1 0'/>
	</filter>
	<filter id='monochromacy'>
		<feColorMatrix type='matrix' values='1.00 0.00 0.00 0 0 0.00 1.00 0.00 0 0 0.00 1.00 0.00 0 0 0 0 0 1 0'/>
	</filter>
</svg>