diff --git a/css/main.css b/css/main.css
index e92823d..f00077d 100644
--- a/css/main.css
+++ b/css/main.css
@@ -14,7 +14,7 @@ html {
   color: var(--color-foreground);
 }
 
-.tui-box {
+.tui-frame {
   width: 100%;
   height: auto;
   padding: 20px;
@@ -24,7 +24,7 @@ html {
   position: relative;
 }
 
-.tui-header {
+.tui-frame-header {
   position: absolute;
   top: 0;
   left: 25px;
@@ -33,7 +33,7 @@ html {
   padding: 0 10px;
 }
 
-.tui-content p{
+.tui-frame-content p{
   font-size: 12pt;
   margin: 15px 0 15px 0;
 }
diff --git a/index.html b/index.html
index 68327e5..2844130 100644
--- a/index.html
+++ b/index.html
@@ -7,15 +7,29 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <link rel="stylesheet" href="css/main.css">
     <title>// Hex Studios //</title>
+
+    <script>
+      r = document.querySelector(':root');
+
+      function setForegroundColor(color) {
+        r.style.setProperty('--color-foreground', color)
+      }
+    </script>
+    
 </head>
 
 <body>
 
   <div style="width: 50vh; margin-left: 30px; margin-top: 50px;">
+
+    <div class="tui-frame">
+      <h2 class="tui-frame-header">IMAGE</h2>
+      <img src="res/chris2.jpg" style="width:50%;" />
+    </div>
     
-    <div class="tui-box">
-      <h2 class="tui-header">// HEX STUDIOS //</h2>
-      <div class="tui-content">
+    <div class="tui-frame">
+      <h2 class="tui-frame-header">// HEX STUDIOS //</h2>
+      <div class="tui-frame-content">
         <p>Hello! My name is Chris, aka Spudnut2000. Welcome to my personal portfolio site!</p>
         <h2>About Me</h2>
         <p>I am a husband, programmer, musician, and all around nerd. I like to develop both software and games.</p>
@@ -23,5 +37,7 @@
       </div>
     </div>
   </div>
+
+  <button onClick="setForegroundColor('#102090')">Change color</button>
   
 </body>
