diff --git a/src/App.vue b/src/App.vue
index 801abe0..364e6b7 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,9 +1,13 @@
 <script setup lang="ts">
 import { RouterView } from 'vue-router'
 import NavbarItem from './components/NavbarView.vue'
+import DevWarning from './components/DevWarning.vue'
+
+const dev = import.meta.env.DEV
 </script>
 
 <template class="bg-ctp-base h-full">
+  <dev-warning v-if="dev"></dev-warning>
   <navbar-item></navbar-item>
 
   <Suspense>
diff --git a/src/components/DevWarning.vue b/src/components/DevWarning.vue
new file mode 100644
index 0000000..5d949e4
--- /dev/null
+++ b/src/components/DevWarning.vue
@@ -0,0 +1,7 @@
+<template>
+  <div class="rounded-lg z-50 flex m-3 h-20 bg-amber-400 border-4 border-amber-600">
+    <div class="m-auto">
+        <h1 class="font-bold text-2xl">SafeTwitch is currently in development mode.</h1>
+    </div>
+  </div>
+</template>