cyberpink/layouts/partials/chroma.html
2023-08-11 00:10:47 +02:00

43 lines
976 B
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>