diff --git a/back.svg b/back.svg
new file mode 100644
index 0000000..5f7d4a3
--- /dev/null
+++ b/back.svg
@@ -0,0 +1,17 @@
+<?xml version='1.0' encoding='UTF-8'?>
+<!-- This file was generated by dvisvgm 1.15.1 -->
+<svg height='245.918pt' version='1.1' viewBox='56.6209 54.0603 165.618 245.918' width='165.618pt' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'>
+<g id='page1'>
+<g transform='matrix(0.996264 0 0 0.996264 113.909 191.358)'>
+<path d='M 0 100.375C 55.4356 100.375 100.375 55.4356 100.375 0C 100.375 -55.4356 55.4356 -100.375 3.34316e-14 -100.375' fill='none' stroke='#ff0000' stroke-linecap='round' stroke-linejoin='round' stroke-miterlimit='10.0375' stroke-width='15.0562'/>
+</g>
+<g transform='matrix(0.996264 0 0 0.996264 113.909 191.358)'>
+<path d='M 0 -100.375L -50.1875 -100.375' fill='none' stroke='#ff0000' stroke-linecap='round' stroke-linejoin='round' stroke-miterlimit='10.0375' stroke-width='15.0562'/>
+</g>
+<g transform='matrix(0.996264 0 0 0.996264 113.909 191.358)'>
+<path d='M -50.1875 -100.375L -20.075 -130.487' fill='none' stroke='#ff0000' stroke-linecap='round' stroke-linejoin='round' stroke-miterlimit='10.0375' stroke-width='15.0562'/>
+</g>
+<g transform='matrix(0.996264 0 0 0.996264 113.909 191.358)'>
+<path d='M -50.1875 -100.375L -20.075 -70.2625' fill='none' stroke='#ff0000' stroke-linecap='round' stroke-linejoin='round' stroke-miterlimit='10.0375' stroke-width='15.0562'/>
+</g></g>
+</svg>
diff --git a/colors/index.html b/colors/index.html
index 994f8f4..b25b901 100644
--- a/colors/index.html
+++ b/colors/index.html
@@ -2,23 +2,42 @@
   <head>
     <style>
       body {
-        background-color: black;
+          background-color: black;
       }
       #word {
-	font-size: 80px;
-	font-family: sans-serif;
-	font-weight: bold;
-	width: 100%;
-	text-align: center;
-	position: absolute;
-	top: 50%;
-	transform: translateY(-50%);
+          font-size: 80px;
+          font-family: sans-serif;
+          font-weight: bold;
+          width: 100%;
+          text-align: center;
+          position: absolute;
+          top: 50%;
+          transform: translateY(-50%);
+          color: red;
+      }
+
+      #word img {
+          height: 100px;
+          width: 75px;
+      }
+
+      #controls {
+          position: absolute;
+          bottom: 10px;
+          left: 10px;
+      }
+      #controls img {
+          width: 40px;
+          height: 40px;
       }
     </style>
   </head>
   <body>
-    <div id="word"></div>
+    <div id="word"><img src="../play.svg"></div>
     <script type="text/javascript">
+      var started = false;
+      var showControls = false;
+
       var colorWords = ["red", "orange", "yellow", "green", "blue", "purple", "white"];
       var hypnoWords = ["sleep", "relax", "fall", "deeper", "trance"];
       var colors = ["red", "orange", "yellow", "green", "blue", "purple", "white"];
@@ -45,8 +64,22 @@
 	  wordEl.innerText = newWord;
 	  wordEl.style.color = newColor;
       }
-      setInterval(changeWord, 1000);
-      setInterval(function() { if (hypnoFrequency < hypnoIncrements) { hypnoFrequency++; } }, 5000);
+
+      window.onclick = function () {
+          if (!started) {
+              started = true;
+              document.getElementById("controls").style.display = "none";
+              changeWord();
+              setInterval(changeWord, 1000);
+              setInterval(function() { if (hypnoFrequency < hypnoIncrements) { hypnoFrequency++; } }, 5000);
+          } else {
+              document.getElementById("controls").style.display = showControls ? "none" : "block";
+              showControls = !showControls;
+          }
+      }
     </script>
+
+    <div id="controls"><a href=".."><img src="../back.svg"></a> <a href="."><img src="../reload.svg"></a></div>
+
   </body>
 </html>
diff --git a/follow/index.html b/follow/index.html
index d4ef1f5..baf4b40 100644
--- a/follow/index.html
+++ b/follow/index.html
@@ -51,6 +51,10 @@
           bottom: 10px;
           left: 10px;
       }
+      #controls img {
+          width: 40px;
+          height: 40px;
+      }
       input[type=checkbox]:checked ~ #controls {
           display: block;
       }
@@ -75,6 +79,6 @@
       </svg>
     </div>
     <input type="checkbox">
-    <div id="controls"><a href="..">back</a></div>
+    <div id="controls"><a href=".."><img src="../back.svg"></a></div>
   </body>
 </html>
diff --git a/play.svg b/play.svg
new file mode 100644
index 0000000..b6c0d50
--- /dev/null
+++ b/play.svg
@@ -0,0 +1,8 @@
+<?xml version='1.0' encoding='UTF-8'?>
+<!-- This file was generated by dvisvgm 1.15.1 -->
+<svg height='100.375pt' version='1.1' viewBox='56.6209 54.0603 75.2808 100.375' width='75.2808pt' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'>
+<g id='page1'>
+<g transform='matrix(0.996264 0 0 0.996264 56.4094 103.858)'>
+<path d='M 0 50.1875L 0 -50.1875L 75.2812 0L 0 50.1875Z' fill='#ff0000'/>
+</g></g>
+</svg>
diff --git a/reload.svg b/reload.svg
new file mode 100644
index 0000000..7b7ac4d
--- /dev/null
+++ b/reload.svg
@@ -0,0 +1,14 @@
+<?xml version='1.0' encoding='UTF-8'?>
+<!-- This file was generated by dvisvgm 1.15.1 -->
+<svg height='245.918pt' version='1.1' viewBox='56.6209 54.0603 215.806 245.918' width='215.806pt' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'>
+<g id='page1'>
+<g transform='matrix(0.996264 0 0 0.996264 163.909 191.358)'>
+<path d='M 0 -100.375C -55.4356 -100.375 -100.375 -55.4356 -100.375 -0C -100.375 55.4356 -55.4356 100.375 0 100.375C 55.4356 100.375 100.375 55.4356 100.375 0C 100.375 -43.3739 72.864 -80.3222 34.3396 -94.3473' fill='none' stroke='#ff0000' stroke-linecap='round' stroke-linejoin='round' stroke-miterlimit='10.0375' stroke-width='15.0562'/>
+</g>
+<g transform='matrix(0.996264 0 0 0.996264 163.909 191.358)'>
+<path d='M 0 -100.375L -30.1125 -130.487' fill='none' stroke='#ff0000' stroke-linecap='round' stroke-linejoin='round' stroke-miterlimit='10.0375' stroke-width='15.0562'/>
+</g>
+<g transform='matrix(0.996264 0 0 0.996264 163.909 191.358)'>
+<path d='M 0 -100.375L -30.1125 -70.2625' fill='none' stroke='#ff0000' stroke-linecap='round' stroke-linejoin='round' stroke-miterlimit='10.0375' stroke-width='15.0562'/>
+</g></g>
+</svg>
