diff --git "a/\\" "b/\\"
new file mode 100644
index 0000000..5c36b35
--- /dev/null
+++ "b/\\"
@@ -0,0 +1,21 @@
+const buttons = document.getElementsByClassName("randomword-button");
+
+export function randomizeWords() {
+  registerButtons();
+}
+
+function registerButtons() {
+  for (let button of buttons) {
+    button.addEventListener("click", function () {
+      button.innerHTML = processWordlist(button.getAttribute("data-wordlist"));
+    });
+    button.click();
+  }
+}
+
+// takes all the words and returns only one
+function processWordlist(wordlist) {
+  return wordlist;
+}
+
+function stripSpaces() {}
diff --git a/assets/scss/colors.scss b/assets/scss/colors.scss
index 6b6bef4..4fa1ad5 100644
--- a/assets/scss/colors.scss
+++ b/assets/scss/colors.scss
@@ -35,6 +35,25 @@ a {
   color: $dark-ln;
 }
 
+.randomword-button{
+  &.light {
+    border-color: $light-fg;
+    background-color: $light-bg;
+    color: $light-fg;
+    &:hover {
+      color: $light-bg;
+      background-color: $light-fg;
+    }
+  }
+  border-color: $dark-fg;
+  background-color: $dark-bg;
+  color: $dark-fg;
+  &:hover{
+    color: $dark-bg;
+    background-color: $dark-fg;
+  }
+}
+
 a.footer-nav-item.active,
 a.footer-nav-item:hover {
   &.light {
diff --git a/assets/scss/layout.scss b/assets/scss/layout.scss
index ac403a4..08feff7 100644
--- a/assets/scss/layout.scss
+++ b/assets/scss/layout.scss
@@ -21,13 +21,19 @@ footer {
   margin-bottom: 84pt;
 }
 
+.randomword-button {
+  width: auto;
+  height: auto;
+}
+
 #content p,
 #content ul,
 #content ol,
 #content table,
 code,
 .postdescription,
-hr
+hr,
+#content div .video-player
 {
   margin-right: 24%;
   margin-left: 24%;
diff --git a/assets/scss/style.scss b/assets/scss/style.scss
index 664d339..14e75e0 100644
--- a/assets/scss/style.scss
+++ b/assets/scss/style.scss
@@ -108,3 +108,12 @@ ul a{
     padding: 0.12em;
   }
 }
+
+.randomword-button {
+  border-style: solid;
+  padding: 0.12em;
+  border-radius: 0;
+   &::before {
+    content: " ";
+  }
+}
diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html
index 69a1be2..6adab8f 100644
--- a/layouts/_default/baseof.html
+++ b/layouts/_default/baseof.html
@@ -5,6 +5,5 @@
     {{- partial "header.html" . -}}
     <div id="content">{{- block "main" . }}{{- end }}</div>
     {{- partial "footer.html" . -}}
-    <script type="module" src="/js/main.js"></script>
   </body>
 </html>
diff --git a/layouts/partials/head.html b/layouts/partials/head.html
index 37a42f3..1b6c536 100644
--- a/layouts/partials/head.html
+++ b/layouts/partials/head.html
@@ -2,6 +2,7 @@
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1">
     <title>{{ .Title }}@{{ .Site.Title }}</title>
+    <script type="module" src="/js/main.js"></script>
     {{ $css := resources.Get "scss/main.scss" }}
     {{ $css = $css | toCSS }}
     <link rel="stylesheet" href="{{ $css.RelPermalink }}">
diff --git a/layouts/shortcodes/randomword.html b/layouts/shortcodes/randomword.html
new file mode 100644
index 0000000..5fdf4fd
--- /dev/null
+++ b/layouts/shortcodes/randomword.html
@@ -0,0 +1 @@
+<button class="randomword-button colorswitch" data-wordlist="{{.Get 0}}"></button>
diff --git a/static/js/lightmode.js b/static/js/lightmode.js
index cc5f62d..2bcc10b 100644
--- a/static/js/lightmode.js
+++ b/static/js/lightmode.js
@@ -12,7 +12,6 @@ function switchToLight() {
 function switchToDark() {
   button.innerHTML = "";
   for (let item of colorswitchers) {
-    console.log(item);
     item.classList.remove("light");
   }
 }
diff --git a/static/js/main.js b/static/js/main.js
index 6fc7c3d..fbd249e 100644
--- a/static/js/main.js
+++ b/static/js/main.js
@@ -1,7 +1,9 @@
 import { updateMode } from "./lightmode.js";
 import { activateHamburger } from "./hamburger.js";
+import { randomizeWords } from "./randomword.js";
 
 document.addEventListener("DOMContentLoaded", () => {
   updateMode();
   activateHamburger();
+  randomizeWords();
 });
diff --git a/static/js/randomword.js b/static/js/randomword.js
new file mode 100644
index 0000000..3dd5780
--- /dev/null
+++ b/static/js/randomword.js
@@ -0,0 +1,31 @@
+const buttons = document.getElementsByClassName("randomword-button");
+
+export function randomizeWords() {
+  registerButtons();
+}
+
+function registerButtons() {
+  for (let button of buttons) {
+    button.addEventListener("click", function () {
+      let new_word = processWordlist(button.getAttribute("data-wordlist"));
+      // do this so people dont have to click twice
+      if (button.innerHTML == new_word) {
+        button.click();
+        console.log("oh no!!! this was already the value!");
+      } else {
+        button.innerHTML = new_word;
+      }
+    });
+    button.click();
+  }
+}
+
+// takes all the words and returns only one
+function processWordlist(wordlist) {
+  let seperated = wordlist.split(",");
+  return seperated.random();
+}
+
+Array.prototype.random = function () {
+  return this[Math.floor(Math.random() * this.length)];
+};