Admit it: there’s a person in your office that you would love to prank or see them get pranked. Whether it’s covering their desk in aluminum foil or the classic Whoopie Cushion, the possibilities are only limited by your mind. But given the ubiquity of computers in the work environment today, why not pull off a prank that only takes a few lines of code? Better yet, all you have to do is copy and paste in the code.

Obligatory disclaimer

I am not responsible for any consequences that arise from using these pranks. This includes but is not limited to being yelled at by your boss, getting fired, or getting pranked in revenge by your office mates. Whether you choose to prank someone is up to you and your company’s policy.

These pranks are intended to be harmless; that is they won’t erase or mutilate any data on the computer or network. But I will make no guarantees about what happens when your coworker gets pranked!

How to pull off the prank

These pranks are designed for web browsers, and there’s quite a few of them out there. The instructions will vary depending on what browser they use, and which operating system they’re on.

  • Step 1: Open up their browser to some webpage, if it’s not already open
  • Step 2: Open up Web Developer tools, using one of the keyboard shortcuts below
    Browser Windows Linux Mac OS
    Chrome Ctrl + Shift + J Cmd + Option + J
    Opera Ctrl + Shift + J Press F12 and go to “Console” tab Cmd + Option + J
    Firefox Ctrl + Shift + K Cmd + Option + K
    Safari N/A Go to Preferences → Advanced and check “Enable Developer Tools” at the bottom. Then press Cmd + Option + C
    Internet Explorer, Microsoft Edge Press F12 and go to “Console” tab N/A
  • Step 3: Paste one of the code snippets below into the Console.
  • Step 4: Press Enter.
  • Step 5: Profit from your coworker’s priceless reaction.

Code snippets

Copy and paste one of these into the console that you just opened.

Prank 1: The wheels on the bus go round and round…

This will cause all of the content on the page to spin indefinitely.

var sheet=(function() {
    var style=document.createElement("style");
    style.appendChild(document.createTextNode(""));
    document.head.appendChild(style);
    return style.sheet;
})();
try {
  sheet.insertRule("@-webkit-keyframes spin{100%{-webkit-transform:rotate(360deg);}}",0);
  sheet.insertRule("*{-webkit-animation:spin 3s linear infinite;}",0);
} catch(e) {
  sheet.insertRule("@keyframes spin{100%{transform:rotate(360deg);}}",0);
  sheet.insertRule("*{animation:spin 3s linear infinite;}",0);
}

Prank 2: Help! I’m going blind!

This will occasionally make all the content blurry. May not work on IE.

var sheet=(function() {
    var style=document.createElement("style");
    style.appendChild(document.createTextNode(""));
    document.head.appendChild(style);
    return style.sheet;
})();
try {
  sheet.insertRule("@-webkit-keyframes blur{50%{-webkit-filter:blur(5px);}}",0);
  sheet.insertRule("body{-webkit-animation:blur 5s linear infinite;}",0);
} catch(e) {
  sheet.insertRule("@keyframes blur{50%{filter:blur(5px);}}",0);
  sheet.insertRule("body{animation:blur 5s linear infinite;}",0);
}

Prank 3: Slipping away

Everything will slowly slide down the page.

var sheet=(function() {
    var style=document.createElement("style");
    style.appendChild(document.createTextNode(""));
    document.head.appendChild(style);
    return style.sheet;
})();
try {
  sheet.insertRule("@-webkit-keyframes slide{100%{-webkit-transform:translateY(100%);}}",0);
  sheet.insertRule("body{-webkit-animation:slide 60s linear;}",0);
} catch(e) {
  sheet.insertRule("@keyframes slide{100%{transform:translateY(100%);}}",0);
  sheet.insertRule("body{animation:slide 60s linear;}",0);
}

Prank 4: Inverted colors

Just as the title suggests, this makes their web page colors flip from normal to inverted and back, ad infinitum.

var sheet=(function() {
    var style=document.createElement("style");
    style.appendChild(document.createTextNode(""));
    document.head.appendChild(style);
    return style.sheet;
})();
try {
  sheet.insertRule("@-webkit-keyframes invert{50%{-webkit-filter:invert(100%);}}",0);
  sheet.insertRule("body{-webkit-animation:invert 5s linear infinite;}",0);
} catch(e) {
  sheet.insertRule("@keyframes invert{50%{filter:invert(100%);}}",0);
  sheet.insertRule("body{animation:invert 5s linear infinite;}",0);
}

Prank 5: Something’s askew

Fun fact: if you go on Google Search and type “askew”, the page will literally be askew. Now you can bring the joy of a tilted web page to your hapless coworker.

var sheet=(function() {
    var style=document.createElement("style");
    style.appendChild(document.createTextNode(""));
    document.head.appendChild(style);
    return style.sheet;
})();
sheet.insertRule("body{-webkit-transform:rotate(5deg);transform:rotate(5deg);}",0);

Make it stop!

To make any of these stop, just copy and paste the following code into the console and hit Enter.

sheet.deleteRule(0);

Published by Geoffrey Liu

A software engineer by trade and a classical musician at heart. Currently a software engineer at Groupon getting into iOS mobile development. Recently graduated from the University of Washington, with a degree in Computer Science and a minor in Music. Web development has been my passion for many years. I am also greatly interested in UI/UX design, teaching, cooking, biking, and collecting posters.

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.