diff --git a/assets/iconb.webp b/assets/iconb.webp
new file mode 100644
index 0000000..7dd0374
Binary files /dev/null and b/assets/iconb.webp differ
diff --git a/index.html b/index.html
index 06f51cc..7aff126 100644
--- a/index.html
+++ b/index.html
@@ -10,11 +10,11 @@
     <meta name="viewport" content="width=device-width, initial-scale=1">
 
     <meta name="darkreader-lock">
-    <meta name="color-scheme" content="only light">
+    <meta name="color-scheme" content="dark">
 
     <meta name="description" content="my personal website. come look around!">
     <meta name="theme-color" content="#c4b5a1">
-    <meta property="og:image" content="https://min.rip/assets/icon.webp">
+    <meta property="og:image" content="https://min.rip/assets/iconb.webp">
 
     <title>minish</title>
 
@@ -27,7 +27,10 @@
     <main>
         <div id="floats">
             <div id="yapping">
-                <h1>hi world !</h1>
+                <span>
+                    <h1 id="title">hi world !</h1>
+                    <img src="/assets/icon.webp" alt="" class="icon" id="icon-mobile">
+                </span>
                 <h2>i am minish</h2>
                 <p>Hi, i go by minish online. i enjoy programming & reverse engineering.</p>
                 <p>a few of my recent projects are &ndash;</p>
@@ -72,7 +75,7 @@
                     </ul>
                 </details>
             </div>
-            <img src="/assets/icon.webp" alt="" id="icon">
+            <img src="/assets/icon.webp" alt="" class="icon" id="icon-desktop">
         </div>
         <div id="cont">
             <hr>
diff --git a/style.css b/style.css
index af2c77f..8ef7e94 100644
--- a/style.css
+++ b/style.css
@@ -88,7 +88,7 @@ main {
     border-width: 0px;
   }
 
-  #icon {
+  #icon-desktop {
     display: none;
   }
 
@@ -101,6 +101,10 @@ main {
   #learning {
     grid-template-columns: auto auto;
   }
+
+  #icon-mobile {
+    display: none;
+  }
 }
 
 .interests {
@@ -130,14 +134,26 @@ h2 {
   display: flex;
 }
 
-#icon {
+#icon-desktop {
   justify-self: right;
 
   /* make some space around it */
   margin-left: 24px;
 
   height: 7em;
+}
 
+#icon-mobile {
+  height: 2.25em;
+  margin-left: 10px;
+}
+
+#title, #icon-mobile {
+  display: inline-block;
+  vertical-align: middle;
+}
+
+.icon {
   filter: drop-shadow(1px 1px 0 var(--accent))
     drop-shadow(-1px 1px 0 var(--accent)) drop-shadow(1px -1px 0 var(--accent))
     drop-shadow(-1px -1px 0 var(--accent));