DEV Community πŸ‘©β€πŸ’»πŸ‘¨β€πŸ’»

DEV Community πŸ‘©β€πŸ’»πŸ‘¨β€πŸ’» is a community of 968,547 amazing developers

We're a place where coders share, stay up-to-date and grow their careers.

Create account Log in
Cover image for This Image is Also an HTML Webpage
Ben Halpern
Ben Halpern

Posted on

This Image is Also an HTML Webpage

Here is an image:

Also an HTML page

But it is also an HTML page. Here is the markup for the above image:

<img src="http://lcamtuf.coredump.cx/squirrel/" />
Enter fullscreen mode Exit fullscreen mode

Now try visiting that webpage:

http://lcamtuf.coredump.cx/squirrel/

Pretty cool, eh?

I did not make this. I am just showing you because it is cool.

Here is an explanation of what is happening:

  1. The file is a valid jpeg file with some html in metadata.
  2. The server responds with Content-Type: text/html, making browser interpret the response body as html.
  3. Browser ignores jpeg header until it sees and starts to render the html.
  4. The html in the jpeg metadata ends with "<!--" , which starts html comment.
  5. The html has that renders the file as image.

I found this hack fascinating, and I hope you did too.

Top comments (0)

🌚 Friends don't let friends browse without dark mode.

Sorry, it's true.