diff --git a/pages/embed.tsx b/pages/embed.tsx
index df25781..9175cd8 100644
--- a/pages/embed.tsx
+++ b/pages/embed.tsx
@@ -2,6 +2,7 @@ import { useEffect, useState } from 'react'
 import { SandpackFiles } from '@codesandbox/sandpack-react'
 import { generate } from '../utils/helper'
 import BrowserPreview from '../components/BrowserPreview'
+import { AppPage } from '../components/AppPage'
 
 const Embed = () => {
   const [files, setFiles] = useState<SandpackFiles>({})
@@ -27,16 +28,44 @@ const Embed = () => {
   }, [])
 
   return (
-    <div className="preview">
-      <BrowserPreview
-        options={{ files, displayFiles: false, theme: 'codesandbox-light' }}
-      />
-      <style jsx>{`
-        .preview {
-          height: calc(100vh - 15px);
-        }
-      `}</style>
-    </div>
+    <AppPage>
+      <div className="preview">
+        {Object.keys(files || {}).length > 0 && (
+          <BrowserPreview
+            options={{ files, displayFiles: false, theme: 'codesandbox-light' }}
+          />
+        )}
+        {Object.keys(files || {}).length === 0 && (
+          <div className="empty_state">
+            <img className="logo" src="/static/svg/logo_white.svg" alt="Teleport HQ" />
+            Listening for updates
+          </div>
+        )}
+        <style jsx>{`
+          .empty_state {
+            height: 100%;
+            display: flex;
+            align-items: center;
+            background-size: cover;
+            justify-content: center;
+            flex-direction: column;
+            color: var(--main-text-color);
+            font-family: var(--main-font-family);
+            font-size: var(--main-text-font-size);
+            background-image: url('/static/svg/hero.svg');
+          }
+
+          .logo {
+            width: 200px;
+            padding-bottom: 10px;
+          }
+
+          .preview {
+            height: 100vh;
+          }
+        `}</style>
+      </div>
+    </AppPage>
   )
 }
 
diff --git a/public/static/svg/hero.svg b/public/static/svg/hero.svg
new file mode 100644
index 0000000..7a490ea
--- /dev/null
+++ b/public/static/svg/hero.svg
@@ -0,0 +1 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?><svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 1440 770"><defs><style>.cls-1{fill:url(#linear-gradient);}.cls-2{clip-path:url(#clip-path);}.cls-3,.cls-4{opacity:0.7;}.cls-3{fill:url(#linear-gradient-3);}.cls-4{fill:#495fdf;}.cls-5{fill:url(#linear-gradient-4);}</style><linearGradient id="linear-gradient" x1="133.11" y1="16.31" x2="1496.29" y2="872.67" gradientUnits="userSpaceOnUse"><stop offset="0"/><stop offset="0.18" stop-color="#0c3251"/><stop offset="0.41" stop-color="#1c72b9"/><stop offset="0.52" stop-color="#228be2"/><stop offset="0.6" stop-color="#2c82e2"/><stop offset="0.73" stop-color="#4868e1"/><stop offset="0.91" stop-color="#763fdf"/><stop offset="1" stop-color="#8f28de"/></linearGradient><clipPath id="clip-path"><rect id="_Rectangle_" data-name="&lt;Rectangle&gt;" class="cls-1" width="1440" height="770"/></clipPath><linearGradient id="linear-gradient-3" x1="-12.92" y1="-68.68" x2="1526.98" y2="-68.68" gradientTransform="translate(493.98 -781.85) rotate(74.94)" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#ff7564"/><stop offset="0.41" stop-color="#db28de"/><stop offset="1" stop-color="#7e00de"/></linearGradient><linearGradient id="linear-gradient-4" x1="161.73" y1="119.47" x2="2230.52" y2="119.47" gradientTransform="matrix(1, 0, 0, 1, 0, 0)" xlink:href="#linear-gradient-3"/></defs><title>Teleport_Hero_Color</title><rect id="_Rectangle_2" data-name="&lt;Rectangle&gt;" class="cls-1" width="1440" height="770"/><g class="cls-2"><rect class="cls-3" x="78.97" y="-746.73" width="1356.11" height="1356.11" rx="270.43" ry="270.43" transform="translate(626.62 680.19) rotate(-74.94)"/><path class="cls-4" d="M914.43,272.62c97.65,61.81,97.65,162.95,0,224.76L96.78,979.88C-.88,1041.69-80.77,997.71-80.77,882.14V-112.14c0-115.57,79.9-159.55,177.55-97.75Z"/><circle class="cls-5" cx="115" cy="119.47" r="457.98"/></g></svg>
\ No newline at end of file
diff --git a/public/static/svg/logo_white.svg b/public/static/svg/logo_white.svg
new file mode 100644
index 0000000..3af827f
--- /dev/null
+++ b/public/static/svg/logo_white.svg
@@ -0,0 +1 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?><svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 490 114"><defs><style>.cls-1{fill:#fff;}</style></defs><title>Teleport_Logo</title><path class="cls-1" d="M436.29,10.13h4.44v9.94H452.4V10.13h4.44v25H452.4v-11H440.73v11h-4.44Z"/><path class="cls-1" d="M488.51,35.1H474a15.8,15.8,0,0,1-5.41-.9,12.56,12.56,0,0,1-4.3-2.57,11.85,11.85,0,0,1-2.86-4.09,13.63,13.63,0,0,1-1-5.45,12.17,12.17,0,0,1,3.88-9,13.08,13.08,0,0,1,4.18-2.61,14.17,14.17,0,0,1,10.12,0A13.1,13.1,0,0,1,482.73,13a12.17,12.17,0,0,1,3.88,9,11.48,11.48,0,0,1-.48,3.47,10.16,10.16,0,0,1-1.25,2.64,9.06,9.06,0,0,1-1.71,1.92,14.68,14.68,0,0,1-1.82,1.3v.07h7.16ZM473.38,13.51a8.43,8.43,0,0,0-3.33.65A7.88,7.88,0,0,0,467.41,16a8.49,8.49,0,0,0-1.75,2.75,9.23,9.23,0,0,0-.63,3.46,9.74,9.74,0,0,0,.63,3.54,8.44,8.44,0,0,0,1.76,2.82,8.15,8.15,0,0,0,2.66,1.85,8.31,8.31,0,0,0,3.37.67,8.56,8.56,0,0,0,3.4-.67,8.07,8.07,0,0,0,2.7-1.85,8.45,8.45,0,0,0,1.76-2.82,9.72,9.72,0,0,0,.63-3.54,9.21,9.21,0,0,0-.63-3.46A8.36,8.36,0,0,0,479.55,16a8,8,0,0,0-2.7-1.82A9,9,0,0,0,473.38,13.51Z"/><path class="cls-1" d="M115,44.5V35.77h8.47V23.88h10.27V35.77H145V44.5H133.74v18a8.94,8.94,0,0,0,1.16,4.88q1.15,1.8,4.58,1.8a16.57,16.57,0,0,0,3-.3,6.27,6.27,0,0,0,2.57-1V76.5a13.28,13.28,0,0,1-4,1.07,33.42,33.42,0,0,1-4.15.3,21,21,0,0,1-6.72-.9,8.84,8.84,0,0,1-4.11-2.74A10.39,10.39,0,0,1,124,69.65a32,32,0,0,1-.56-6.33V44.5Z"/><path class="cls-1" d="M157.45,59.9A10.43,10.43,0,0,0,161,67.09a11.25,11.25,0,0,0,7.44,2.57,12.25,12.25,0,0,0,6.46-1.58,17.93,17.93,0,0,0,4.58-4l7.36,5.56a20.84,20.84,0,0,1-8,6.33,23.71,23.71,0,0,1-9.33,1.88,24.63,24.63,0,0,1-8.73-1.54,20.93,20.93,0,0,1-7.1-4.36,20.67,20.67,0,0,1-4.75-6.8,21.71,21.71,0,0,1-1.75-8.86,21.71,21.71,0,0,1,1.75-8.86,20.69,20.69,0,0,1,4.75-6.8,20.93,20.93,0,0,1,7.1-4.36,24.65,24.65,0,0,1,8.73-1.54,20,20,0,0,1,7.83,1.5,16.81,16.81,0,0,1,6.08,4.32,20,20,0,0,1,3.94,7,29.58,29.58,0,0,1,1.41,9.54V59.9Zm21-7.7a9.68,9.68,0,0,0-2.82-7.14q-2.74-2.61-7.61-2.61a10,10,0,0,0-7.32,2.65,11.84,11.84,0,0,0-3.29,7.1Z"/><path class="cls-1" d="M195.58,12.16h10.27V76.84H195.58Z"/><path class="cls-1" d="M222.92,59.9a10.43,10.43,0,0,0,3.59,7.19A11.25,11.25,0,0,0,234,69.65a12.25,12.25,0,0,0,6.46-1.58,17.93,17.93,0,0,0,4.58-4l7.36,5.56a20.84,20.84,0,0,1-8,6.33A23.71,23.71,0,0,1,235,77.87a24.63,24.63,0,0,1-8.73-1.54,20.93,20.93,0,0,1-7.1-4.36,20.67,20.67,0,0,1-4.75-6.8,21.71,21.71,0,0,1-1.75-8.86,21.71,21.71,0,0,1,1.75-8.86,20.69,20.69,0,0,1,4.75-6.8,20.93,20.93,0,0,1,7.1-4.36A24.65,24.65,0,0,1,235,34.74a20,20,0,0,1,7.83,1.5,16.81,16.81,0,0,1,6.08,4.32,20,20,0,0,1,3.94,7,29.58,29.58,0,0,1,1.41,9.54V59.9Zm21-7.7a9.68,9.68,0,0,0-2.82-7.14q-2.74-2.61-7.61-2.61a10,10,0,0,0-7.32,2.65,11.84,11.84,0,0,0-3.29,7.1Z"/><path class="cls-1" d="M260.88,35.77h9.75v6.16h.17a13.21,13.21,0,0,1,6-5.48,19.41,19.41,0,0,1,8.13-1.71,20.7,20.7,0,0,1,8.47,1.67A19,19,0,0,1,299.8,41a19.6,19.6,0,0,1,4,6.84,25.62,25.62,0,0,1,1.37,8.47,24.23,24.23,0,0,1-1.46,8.47,21.05,21.05,0,0,1-4.06,6.85,18.75,18.75,0,0,1-6.29,4.58,19.25,19.25,0,0,1-8,1.67,19.85,19.85,0,0,1-5.13-.6,17.65,17.65,0,0,1-3.94-1.54,15.66,15.66,0,0,1-2.91-2,14.65,14.65,0,0,1-2-2.1h-.26V96.35H260.88Zm34.05,20.54a13.39,13.39,0,0,0-.81-4.62,11.63,11.63,0,0,0-2.4-3.94,12.14,12.14,0,0,0-17.71,0,11.59,11.59,0,0,0-2.4,3.94,13.54,13.54,0,0,0,0,9.24,11.57,11.57,0,0,0,2.4,3.94,12.14,12.14,0,0,0,17.71,0,11.61,11.61,0,0,0,2.4-3.94A13.37,13.37,0,0,0,294.93,56.31Z"/><path class="cls-1" d="M309.58,56.31a21.71,21.71,0,0,1,1.75-8.86,20.69,20.69,0,0,1,4.75-6.8,20.93,20.93,0,0,1,7.1-4.36,25.5,25.5,0,0,1,17.45,0,20.94,20.94,0,0,1,7.1,4.36,20.71,20.71,0,0,1,4.75,6.8,21.72,21.72,0,0,1,1.75,8.86,21.73,21.73,0,0,1-1.75,8.86,20.7,20.7,0,0,1-4.75,6.8,20.94,20.94,0,0,1-7.1,4.36,25.5,25.5,0,0,1-17.45,0,20.93,20.93,0,0,1-7.1-4.36,20.67,20.67,0,0,1-4.75-6.8A21.71,21.71,0,0,1,309.58,56.31Zm10.27,0a13.33,13.33,0,0,0,.81,4.62,11.57,11.57,0,0,0,2.4,3.94,12.13,12.13,0,0,0,17.71,0,11.62,11.62,0,0,0,2.4-3.94,13.54,13.54,0,0,0,0-9.24,11.64,11.64,0,0,0-2.4-3.94,12.14,12.14,0,0,0-17.71,0,11.59,11.59,0,0,0-2.4,3.94A13.34,13.34,0,0,0,319.84,56.31Z"/><path class="cls-1" d="M360.72,35.77H371v6.5h.17A12.89,12.89,0,0,1,376,36.71a13.49,13.49,0,0,1,7.27-2,9.89,9.89,0,0,1,1.84.17q.9.17,1.84.43v9.92q-1.28-.34-2.52-.56A14.45,14.45,0,0,0,382,44.5a11,11,0,0,0-5.78,1.33,10.53,10.53,0,0,0-3.34,3,10.1,10.1,0,0,0-1.54,3.42,12.92,12.92,0,0,0-.39,2.57v22H360.72Z"/><path class="cls-1" d="M388.81,44.5V35.77h8.47V23.88h10.27V35.77h11.29V44.5H407.55v18a8.94,8.94,0,0,0,1.16,4.88q1.15,1.8,4.58,1.8a16.57,16.57,0,0,0,3-.3,6.27,6.27,0,0,0,2.57-1V76.5a13.28,13.28,0,0,1-4,1.07,33.42,33.42,0,0,1-4.15.3A21,21,0,0,1,404,77a8.84,8.84,0,0,1-4.11-2.74,10.39,10.39,0,0,1-2.05-4.58,32,32,0,0,1-.56-6.33V44.5Z"/><path class="cls-1" d="M94.34,66.7,78.56,57.59A31.82,31.82,0,1,0,29.95,21H15A13.58,13.58,0,0,0,1.49,34.51V69.8A13.58,13.58,0,0,0,15,83.34H42.3V96.75c0,5.91,3,9.33,7.27,9.33a11.8,11.8,0,0,0,5.82-1.77l39-22.49C101.54,77.66,101.54,70.86,94.34,66.7ZM92.19,78.09l-39,22.49a7.5,7.5,0,0,1-3.67,1.2c-2.59,0-3-3.15-3-5v-45c0-1.88.39-5,3-5a7.49,7.49,0,0,1,3.67,1.2l39,22.49c2,1.18,3.25,2.61,3.25,3.83S94.23,76.92,92.19,78.09ZM5.79,34.51A9.25,9.25,0,0,1,15,25.27H28.72A31.84,31.84,0,0,0,42.3,58.38V79H15A9.25,9.25,0,0,1,5.79,69.8ZM34.58,21A27.52,27.52,0,1,1,74.41,55.19l-19-11a11.8,11.8,0,0,0-5.82-1.77c-4.3,0-7.27,3.43-7.27,9.33V53a27.47,27.47,0,0,1-9.16-27.75c.18-.73.39-1.44.63-2.15S34.28,21.67,34.58,21Z"/></svg>
\ No newline at end of file