MagicEye.js

by Ian PearceFork on Github
Sorry, your browser doesn't support HTML5 Canvas!

MagicEye.js is a JavaScript library for generating "Magic Eye" images in the browser. Technically, it generates single-image random dot stereograms, or SIRDS.

In the above example, pixel values from an HTML5 Canvas are turned into depth data, which are then used to generate a Magic Eye image. The code looks something like this:

var canvas = document.getElementById('canvas');
MagicEye.render({
  el: 'magiceye',
  depthMapper: new MagicEye.CanvasDepthMapper(canvas)
});

More info about MagicEye.js and how to use it can be found on Github.

Fork and enjoy!


More demos:

Text to Magic Eye and JPG to Magic Eye