Resources

People often ask me "How did you learn how to hack?" The answer: by reading. This page is a collection of the blog posts and other articles that I have accumulated over the years of my journey. Enjoy!

Clickjacking is a classic attack in which an iframe is embedded within another website's content, transparently, to trick the user into interacting with that website. This article describes a variant of it they are dubbing SVG clickjacking. They drew inspiration for this from Apple's liquid glass design. Being a CSS, HTML, and SVG wizard, they also got it working in SVGs. They were surprised this worked on SVGs on top of an iframe; this was done via using feColorMatrix and feDisplacementMap. to change the color/location of pixels.

There are many SVG elements with the <fe*> typing. They take in one or more input images, apply operations to them, and output a new image. Some can load an image file. Others can move stuff around. Others can move pixels, blur, crop, expand, blend, and more. With this, it's a great list of utilities to make clickjacking more viable.

Their first example was inline a "secret code" from another website and turning it into a captcha via the feDisplacementMap flag to add blur. You ask the user to type in the code, and it looks somewhat realistic as a CAPTCHA. This isn't very useful because secret code pages like this shouldn't be iframable anyway.

The following strategy is around grey text hiding. Sometimes, there are textboxes with information that needs to be inputted. By using tricks with SVGs, the text box can be reskinned. For instance, instead of saying "set a new password," it can now say "enter your email". This is very confusing but still requires user interaction in order to do.

SVGs are Turing-complete if you get tricky with them based on the data. In practice, this means you can read pixels from the iframe to perform actions on it. Now, the SVG has this data and not the web page itself. This really means interactive, responsive clickjacking. They used this attack on Google Docs to link content with many steps. This would have been impossible before this technique.

They have a quote that I find interesting at the end: "I don’t think me discovering this technique was just luck though. I have a history of seeing things such as CSS as programming languages to exploit and be creative with. It wasn’t a stretch for me to see SVG filters as a programming language either. That, and my overlap between security research and creative projects - I often blur the lines between the two, which is what Antonymph was born out of."

They were experts in CSS and SVG prior to this. They had exploited client-side bugs in the past. With all of this knowledge in their head, this research was bound to be figured out by them at some point. I agree with their statement: it wasn't luck; it was a history of dedication that led them to this point. Great article!