A simple 3D button effect created by layering box-shadows to give 3D feel.
I was inspired to create an "8-bit" version of the button click effect after seeing a similar effect in multiple frameworks like Angular Material and Lumx. I accomplished the pixel feel by inserting a canvas into the button and creating the animation with that. In the future I may attempt to create the animation using CSS instead.
I wanted to split an image and distort it to make it appear like it was broken. This was accomplished using VueJS, Stylus and the HTML5 canvas. I used a canvas to split the image into parts and then used VueJS to render each image as a div. I took this opportunity to try out Stylus instead of SASS, my normal css pre-processor. Two different variations of this effect can be seen on the left.