cyberpink/layouts/partials/chroma.html

<!-- Chromatic abaration effect -->
<svg width="0" height="0">

	<filter id="chroma">
		<feColorMatrix type="matrix"
			result="red_"
			values="4 0 0 0 0 
					0 0 0 0 0 
					0 0 0 0 0 
					0 0 0 1 0"/>
		<feOffset in="red_" dx="2" dy="0" result="red"/>
		<feColorMatrix type="matrix" 
			in="SourceGraphic"
			result="blue_"
			values="0 0 0 0 0
					0 3 0 0 0 
					0 0 10 0 0 
					0 0 0 1 0"/>
		<feOffset in="blue_" dx="-3" dy="0" result="blue"/>
		<feBlend mode="screen" in="red" in2="blue"/>
	</filter>

	<filter id="chromaClick">
		<feColorMatrix type="matrix"
			result="red_"
			values="4 0 0 0 0 
					0 0 0 0 0 
					0 0 0 0 0 
					0 0 0 1 0"/>
		<feOffset in="red_" dx="4" dy="0" result="red"/>
		<feColorMatrix type="matrix" 
			in="SourceGraphic"
			result="blue_"
			values="0 0 0 0 0
					0 3 0 0 0 
					0 0 10 0 0 
					0 0 0 1 0"/>
		<feOffset in="blue_" dx="-5" dy="0" result="blue"/>
		<feBlend mode="screen" in="red" in2="blue"/>
	</filter>

</svg>