CSS Visual Cryptography

Daniel Erenrich
3 min readJun 27, 2015

--

Visual cryptography is an exciting and largely pointless field. People still publish papers in the space but outside of actual spies I have no idea if anyone is still using it.

If you don’t know, visual cryptography is the process of splitting an image into two such that when the two new images are overlaid the original image returns. This animation from Wikipedia demonstrates the principle.

A binary black and white example of visual cryptography

It occurred to me recently that the new CSS compositing and blending rules could allow someone to implement visual cryptography decryption in a browser with no code. The trick is picking the right blending mode.

There are a lot of blending modes and not all of them will work for us.

Most of the blending rules are not suitable for visual cryptography but the “difference blend mode” let’s you XOR colors and thus you can approximate a real encryption algorithm. I’m not positive the difference blend mode is the only one suitable for cryptography and I’d love to see someone do something better.

I wanted to do something more interesting than just decrypting a random image. I decided to upload an encrypted video to youtube and have a browser decrypt it live. This is especially difficult because of the aggressive compression youtube applies to its videos.

The video I encrypted is available here:

The key that decrypt this video is just pure noise:

Together the decrypted video looks like:

You can see the video decrypted live at https://dl.dropboxusercontent.com/u/23621/yt-crypt/bayer/diff_yt.html though it doesn’t work in all browsers.

Why does it look so bad? Well part of it is due to compression but mostly it’s actually due to dithering. Non-binary colors are very hard to get working in visual cryptography so you end up making all the colors binary and then dithering to get intermediates.

Some of you might note that the encrypted video doesn’t look very random. That’s because for simplicity I chose to use a single key frame instead of an entire video of keys. It’s rather like re-using a key in an XOR cipher. Patterns become clear even to the naked eye.

Does this have a potential use? Maybe? Actually I doubt it. I really just did it for fun.

--

--

Responses (1)