I have been lately browsing material icons from this site.

I started to notice that they don't have any free plans as such so you will have to buy the icons if you want to download them. But however I am concerned regarding the preview. I just had to inspect element in the browser and found out that there was a dynamically added style to a div element with the following background-image property:


Wow! I got the URL that leads me to the SVG icon! Then Save as > Download > icon.svg.

The above link might be updated later on as you can see parameters like Expires, Signature, 1, pair-Id and stuff. So you will have to go inspect yourself.

Since this can't be called a vulnerability, I am a bit hesitant to ask how such sites can display a preview without enabling frauds to steal their content.

There should be some way right? Is it impossible?

  • @SteffenUllrich I don't think it is a duplicate since it is about protecting images, not entire content. But it might as well be off-topic since it is not related to information security but rather programming techniques. There is in fact a way to protect images: generate server side preview with a watermark and don't expose the real files for non authorized accounts. Apr 18, 2017 at 14:39
  • @Anders I believe there is a distinct difference between these two questions. The one is about images in general on a public site, the other is about selling images (or icons) and displaying preview before being sold. There is a way to do what author is asking. Stock photography sites use it every day. Please take a look at Getty Images for example. I'm just in doubt whether this question is off topic for security.SE Apr 18, 2017 at 14:57
  • @MarkoVodopija My suggested duplicate question raises watermarking as a possibility, so I think all the OP needs to know is at that link.
    – Anders
    Apr 18, 2017 at 15:00
  • simple: they don't stop anything, they try to make it hard enough to get suckers to buy it.
    – dandavis
    Apr 18, 2017 at 22:48

2 Answers 2


In my opinion, there can be two options. The first would be to add watermarks. The watermarks can be added dynamically(only the fly). There are various tools, that can add watermarks to an image before rendering it. The Second option wont prevent anyone from stealing it, but can help you to claim your image at any later point by checking its signature. The signature can be put into the image by adding some hexadecimal random codes into the image file. Of course, the code wont change the image view/format and it shall not be visible to the naked eye.


Technically, it is impossible to prevent a user from copying a file (in your case, an image). If you have to send the bits over the wire to a client machine, they can save those bits, and replay them at a later date. You can, however, do a couple of things. You can install some sort of DRM system, and encrypt the files so that only they need a client to show the files. It is still possible for someone to reverse engineer the DRM client, and copy the files, and remove the DRM protections (though doing so may be illegal in some jurisdictions.) The other option is to add some sort of digital watermark to the file so that if your image shows up some place else, you can prove that it was your file originally.

Alternatively, you can show a lower quality preview image, and then when the user purchases the image, send them the higher quality image.

  • how would one use drm-protected icons on a site? how much lower res can an icon get?
    – dandavis
    Apr 18, 2017 at 22:47
  • I was answering the question more generically. I am not aware of any way to DRM protect images on the website itself without building some sort of client-side architecture (javascript + html canvas, maybe?). How much lower res the files can get is really more of a marketing question rather than a technical one. Apr 19, 2017 at 14:46

Not the answer you're looking for? Browse other questions tagged .