diff --git a/web/components/global/Head.astro b/web/components/global/Head.astro
new file mode 100644
index 0000000..0130cb2
--- /dev/null
+++ b/web/components/global/Head.astro
@@ -0,0 +1,41 @@
+---
+// Properties
+const {
+    Title,
+    Description,
+    EmbedId,
+    EmbedVideo,
+    EmbedImage,
+    EmbedTitle,
+ } = Astro.props
+
+// Components
+import { Tooltips } from 'astro-tooltips';
+
+// Styles
+import '@styles/base.scss'
+---
+
+<!DOCTYPE html>
+<head>
+    <!-- Metadata -->
+    <title>{Title}</title>
+    <meta name="description" content={Description}>
+
+    <!-- Properties -->
+    <meta charset="UTF-8">
+    <meta name="theme-color" content="#111">
+    <meta name="viewport" content="width=device-1200px, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, shrink-to-fit=yes, viewport-fit=cover, width=device-width, height=device-height, target-densitydpi=device-dpi">
+    <meta http-equiv="content-language" content="en-us">
+    <!-- <link rel="manifest" href="/manifest.json" />
+    <script is:inline src="/service-worker.js"></script> -->
+    <Tooltips interactive={false} delay={[15, 12]} />
+  
+    <!-- Favicon -->
+    <link rel="apple-touch-icon" type="image/png" sizes="256x256" href="/images/logo/Favicon.png">
+    <link rel="icon" type="image/png" sizes="256x256" href="/images/logo/Favicon.png">
+
+    <!-- Fonts -->
+    <!-- https://github.com/github/mona-sans -->
+    <link rel="preload" href="/fonts/mona-sans/Mona-Sans.woff2" as="font" type="font/woff2" crossorigin>
+</head>
\ No newline at end of file
diff --git a/web/env.d.ts b/web/env.d.ts
new file mode 100644
index 0000000..dae6149
--- /dev/null
+++ b/web/env.d.ts
@@ -0,0 +1 @@
+/// <reference path=".astro/types.d.ts" />
\ No newline at end of file
diff --git a/web/layouts/Default.astro b/web/layouts/Default.astro
index e69de29..9a5d4a1 100644
--- a/web/layouts/Default.astro
+++ b/web/layouts/Default.astro
@@ -0,0 +1,59 @@
+---
+// Properties
+const {Title} = Astro.props
+
+// Components
+import Head from '@components/global/Head.astro'
+import {Sidebar} from '@minpluto/polestar'
+
+// Icons
+import {
+    InputSearch,
+    ProfileCircle,
+    GraphUp,
+    Movie,
+    MusicDoubleNote,
+    Gamepad,
+    AppleImac2021Side,
+    EmojiTalkingHappy,
+    PlanetAlt,
+    Settings,
+    MediaVideoList,
+	LogOut,
+	OpenInBrowser
+} from '@iconoir/vue'
+---
+
+<Head Title={Title}/>
+<Sidebar
+    LogoPath="http://localhost:1930/images/logo/MinPluto - Logo.png"
+    ShowHeader
+    ShowVersion
+    FooterLinks
+>
+    <slot slot="header-items">
+        <a href="#"><InputSearch/></a>
+        <a href="#"><ProfileCircle/></a>
+    </slot>
+    <slot slot="top-items">
+        <a href="#"><PlanetAlt/> Home</a>
+        <a href="#"><MediaVideoList/> Feed</a>
+        <h2>Categories</h2>
+        <a href="#"><GraphUp/> Trending</a>
+        <a href="#"><Movie/> Trailers</a>
+        <a href="#"><MusicDoubleNote/> Music</a>
+        <a href="#"><Gamepad/> Gaming</a>
+        <h2>Discovery</h2>
+        <a href="#"><EmojiTalkingHappy/> Comedy</a>
+        <a href="#"><Gamepad/> Gaming</a>
+        <a href="#"><AppleImac2021Side/> Tech</a>
+        <!-- <h2>Creators</h2> --> <!-- Should be used for user's subscription -->
+    </slot>
+    <slot slot="bottom-items">
+
+    </slot>
+    <slot slot="footer-items">
+        <a href="#"><LogOut/></a>
+        <a href="#"><Settings/></a>
+    </slot>
+</Sidebar>
\ No newline at end of file
diff --git a/web/pages/index.astro b/web/pages/index.astro
index e69de29..824809c 100644
--- a/web/pages/index.astro
+++ b/web/pages/index.astro
@@ -0,0 +1,6 @@
+---
+// Layout
+import Base from '@layouts/Default.astro'
+---
+
+<Base/>
\ No newline at end of file
diff --git a/web/src/env.d.ts b/web/src/env.d.ts
new file mode 100644
index 0000000..9bc5cb4
--- /dev/null
+++ b/web/src/env.d.ts
@@ -0,0 +1 @@
+/// <reference path="../.astro/types.d.ts" />
\ No newline at end of file
