diff --git a/snippets/overlay/README.md b/snippets/overlay/README.md
new file mode 100644
index 0000000..279ce57
--- /dev/null
+++ b/snippets/overlay/README.md
@@ -0,0 +1,3 @@
+### overlay.js
+
+Add an semi-transparent image overlay over your page to have pixel-perfect integration with your designs.
diff --git a/snippets/overlay/overlay.js b/snippets/overlay/overlay.js
new file mode 100644
index 0000000..287ec16
--- /dev/null
+++ b/snippets/overlay/overlay.js
@@ -0,0 +1,17 @@
+var storageKey = 'overlay-default';
+var overlayDefault = localStorage.getItem(storageKey) || '';
+var url = prompt('paste overlay url', overlayDefault);
+if (url) {
+    localStorage.setItem(storageKey, url);
+    var overlay = document.createElement('div');
+    overlay.style.position = 'absolute';
+    overlay.style.left = 0;
+    overlay.style.top = 0;
+    overlay.style.width = '100%';
+    overlay.style.height='100%';
+    overlay.style.backgroundImage = 'url(' + url + ')';
+    overlay.style.backgroundSize = 'cover';
+    overlay.style.zIndex=10000;
+    overlay.style.opacity = 0.5;
+    document.body.appendChild(overlay);
+}