diff --git a/package.json b/package.json
index dd40ca1..582c093 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "geode-studio",
   "private": true,
-  "version": "0.0.3",
+  "version": "0.0.2",
   "type": "module",
   "scripts": {
     "tauri": "tauri"
diff --git a/src-tauri/Cargo.lock b/src-tauri/Cargo.lock
index b522a7e..6464a11 100644
--- a/src-tauri/Cargo.lock
+++ b/src-tauri/Cargo.lock
@@ -881,7 +881,7 @@ dependencies = [
 
 [[package]]
 name = "geode-studio"
-version = "0.0.1"
+version = "0.0.2"
 dependencies = [
  "serde",
  "serde_json",
diff --git a/src-tauri/Cargo.toml b/src-tauri/Cargo.toml
index e1c67a1..a871476 100644
--- a/src-tauri/Cargo.toml
+++ b/src-tauri/Cargo.toml
@@ -1,6 +1,6 @@
 [package]
 name = "geode-studio"
-version = "0.0.1"
+version = "0.0.2"
 description = "A Tauri App"
 authors = ["you"]
 license = ""
diff --git a/src-tauri/tauri.conf.json b/src-tauri/tauri.conf.json
index b1cdc4a..e03e966 100644
--- a/src-tauri/tauri.conf.json
+++ b/src-tauri/tauri.conf.json
@@ -8,7 +8,7 @@
   },
   "package": {
     "productName": "geode-studio",
-    "version": "0.0.1"
+    "version": "0.0.2"
   },
   "tauri": {
     "allowlist": {
@@ -64,4 +64,4 @@
       }
     ]
   }
-}
+}
\ No newline at end of file
diff --git a/src/css/content.css b/src/css/content.css
index 3faa464..ceed503 100644
--- a/src/css/content.css
+++ b/src/css/content.css
@@ -4,4 +4,10 @@
   left: 0px;
   right: 0px;
   bottom: 0px;
+  overflow: hidden;
+}
+#content canvas {
+  position: absolute;
+  width: 1200px;
+  height: 1200px;
 }/*# sourceMappingURL=content.css.map */
\ No newline at end of file
diff --git a/src/css/content.css.map b/src/css/content.css.map
index 4addc50..9f5eca9 100644
--- a/src/css/content.css.map
+++ b/src/css/content.css.map
@@ -1 +1 @@
-{"version":3,"sources":["content.scss","content.css"],"names":[],"mappings":"AAAA;EACI,kBAAA;EACA,SAAA;EACA,SAAA;EACA,UAAA;EACA,WAAA;ACCJ","file":"content.css"}
\ No newline at end of file
+{"version":3,"sources":["content.scss","content.css"],"names":[],"mappings":"AAAA;EACI,kBAAA;EACA,SAAA;EACA,SAAA;EACA,UAAA;EACA,WAAA;EACA,gBAAA;ACCJ;ADCI;EACI,kBAAA;EACA,aAAA;EACA,cAAA;ACCR","file":"content.css"}
\ No newline at end of file
diff --git a/src/css/content.scss b/src/css/content.scss
index 0be0b6f..674371b 100644
--- a/src/css/content.scss
+++ b/src/css/content.scss
@@ -4,4 +4,11 @@
     left: 0px;
     right: 0px;
     bottom: 0px;
+    overflow: hidden;
+
+    canvas {
+        position: absolute;
+        width: 1200px;
+        height: 1200px;
+    }
 }
\ No newline at end of file
diff --git a/src/css/main.css b/src/css/main.css
index 4be65b7..a2c7343 100644
--- a/src/css/main.css
+++ b/src/css/main.css
@@ -5,4 +5,15 @@ body {
   font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
   font-weight: 400;
   font-size: 12px;
+}
+
+#context {
+  position: absolute;
+  display: flex;
+  z-index: 100;
+  background: #222;
+  border-radius: 8px;
+  box-shadow: 4px 4px 14px rgba(0, 0, 0, 0.4);
+  min-width: 50px;
+  min-height: 50px;
 }/*# sourceMappingURL=main.css.map */
\ No newline at end of file
diff --git a/src/css/main.css.map b/src/css/main.css.map
index 36f4d9c..6f153a2 100644
--- a/src/css/main.css.map
+++ b/src/css/main.css.map
@@ -1 +1 @@
-{"version":3,"sources":["main.scss","main.css"],"names":[],"mappings":"AAAA;EACI,gBAAA;EACA,WAAA;EACA,WAAA;EACA,4DAAA;EACA,gBAAA;EACA,eAAA;ACCJ","file":"main.css"}
\ No newline at end of file
+{"version":3,"sources":["main.scss","main.css"],"names":[],"mappings":"AAAA;EACI,gBAAA;EACA,WAAA;EACA,WAAA;EACA,4DAAA;EACA,gBAAA;EACA,eAAA;ACCJ;;ADEA;EACI,kBAAA;EACA,aAAA;EACA,YAAA;EACA,gBAAA;EACA,kBAAA;EACA,2CAAA;EACA,eAAA;EACA,gBAAA;ACCJ","file":"main.css"}
\ No newline at end of file
diff --git a/src/css/main.scss b/src/css/main.scss
index 0a9fb6c..71eb2e8 100644
--- a/src/css/main.scss
+++ b/src/css/main.scss
@@ -5,4 +5,15 @@ body {
     font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
     font-weight: 400;
     font-size: 12px;
+}
+
+#context {
+    position: absolute;
+    display: flex;
+    z-index: 100;
+    background: #222;
+    border-radius: 8px;
+    box-shadow: 4px 4px 14px #0006;
+    min-width: 50px;
+    min-height: 50px;
 }
\ No newline at end of file
diff --git a/src/index.html b/src/index.html
index dc82463..54ade4f 100644
--- a/src/index.html
+++ b/src/index.html
@@ -6,6 +6,7 @@
     <title>Geode Studio</title>
 
     <script type="module" type="text/javascript" src="/js/title.js" defer></script>
+    <script type="module" type="text/javascript" src="/js/main.js" defer></script>
 
     <link rel="stylesheet" href="/css/main.css" />
     <link rel="stylesheet" href="/css/title.css" />
@@ -33,6 +34,10 @@
       </span>
     </div>
 
-    <div id="content"></div>
+    <div style="display: none; pointer-events: none;" id="context"></div>
+
+    <div id="content">
+      <canvas data-context></canvas>
+    </div>
   </body>
 </html>
diff --git a/src/js/canvas.js b/src/js/canvas.js
new file mode 100644
index 0000000..e69de29
diff --git a/src/js/main.js b/src/js/main.js
new file mode 100644
index 0000000..d9ba8fc
--- /dev/null
+++ b/src/js/main.js
@@ -0,0 +1,28 @@
+let context = document.querySelector('#context')
+
+function hideContext() {
+    context.style.display = 'none'
+    context.style.pointerEvent = 'none'
+}
+
+document.addEventListener('contextmenu', e => {
+    e.preventDefault()
+
+    if (e.target.dataset.context == undefined) return hideContext()
+
+    context.style.display = ''
+    context.style.pointerEvent = ''
+
+    context.style.top = e.clientY + 10 + 'px'
+    context.style.left = e.clientX + 10 + 'px'
+
+    let bounding = context.getBoundingClientRect()
+
+    if (bounding.bottom >= (window.innerHeight - 5 || document.documentElement.clientHeight - 5))
+        context.style.top = e.clientY - bounding.height + 'px'
+    
+    if (bounding.right >= (window.innerWidth - 5 || document.documentElement.clientWidth - 5))
+        context.style.left = e.clientX - bounding.width + 'px'
+})
+
+document.addEventListener('click', hideContext)
\ No newline at end of file