diff --git a/public/assets/js/search.js b/public/assets/js/search.js
new file mode 100644
index 0000000000..edc2aa28b5
--- /dev/null
+++ b/public/assets/js/search.js
@@ -0,0 +1,18 @@
+function myFunction() {
+    // Declare variables
+    var input, filter, ul, li, a, i;
+    input = document.getElementById("mySearch");
+    filter = input.value.toUpperCase();
+    ul = document.getElementById("test");
+    li = ul.getElementsByClassName("card");
+  
+    // Loop through all list items, and hide those who don't match the search query
+    for (i = 0; i < li.length; i++) {
+      a = li[i].getElementsByTagName("p3")[0];
+      if (a.innerHTML.toUpperCase().indexOf(filter) > -1) {
+        li[i].style.display = "";
+      } else {
+        li[i].style.display = "none";
+      }
+    }
+  }
\ No newline at end of file
diff --git a/public/play.html b/public/play.html
index a0d9399bd5..0c4272ba43 100644
--- a/public/play.html
+++ b/public/play.html
@@ -178,6 +178,7 @@
   <script src="/js/index.js"></script>
   <script src="./uv/uv.bundle.js"></script>
   <script src="./uv/uv.config.js"></script>
+  <script src="/public/assets/js/search.js"></script>
   <script src="index.js"></script>
 
        <!-- Google tag (gtag.js) -->
@@ -203,12 +204,10 @@ <h2>Interstellar</h2>
 <li><a onclick="widgetBot()">Widgetbot</a></li>
   </ul>
 </nav>
-  <div>
-    <center>
-    <button onclick="randomlink()" class="random-btn">Random Game Button (TESTING)</button>
-  </center>
-</div>
-<br>
+  <br>
+  <input type="text" id="mySearch" onkeyup="myFunction()" placeholder="Search.." >
+    <button onclick="randomlink()" class="random-btn">Random Game Button</button>
+    <div class="test">
  <div class="row">
   <div style="padding-left: 20px" id="buttonDiv7">
     <div class="row">
@@ -538,6 +537,8 @@ <h2>Interstellar</h2>
 </div>
 </div>
 </div>
+</div>
+