diff --git a/packages/gui/src/components/Preflight/Preflight.svelte b/packages/gui/src/components/Preflight/Preflight.svelte
index b4b5df2..53c2f7d 100644
--- a/packages/gui/src/components/Preflight/Preflight.svelte
+++ b/packages/gui/src/components/Preflight/Preflight.svelte
@@ -1,6 +1,35 @@
 <script lang="ts">
 	import '$appcss';
-	import Placeholder from '$components/Placeholder/Placeholder.svelte';
+	import { open } from '@tauri-apps/api/shell';
+	const openGithub = () => {
+		open('https://github.com/teaxyz');
+	};
 </script>
 
-<Placeholder label="Preflight" />
+<div class="card social-box" style="width: 100%; float:right;">
+	<header class="border-b border-gray pt-7 pb-7 pl-5 text-primary">PRE-FLIGHT</header>
+	<div class="listbox-item border-b border-gray p-6">
+		<a href="/cli">
+			<p>Install Tea</p>
+		</a>
+	</div>
+	<div class="listbox-item border-b border-gray p-6">
+		<div>
+			<p>Authenticate</p>
+		</div>
+	</div>
+	<div class="listbox-item p-6">
+		<button on:click={openGithub}>Give tea a star</button>
+	</div>
+</div>
+
+<style>
+	.card {
+		border: 2px solid #949494;
+		background-color: #1a1a1a;
+	}
+
+	.listbox-item {
+		height: 75px;
+	}
+</style>