diff --git a/Cargo.lock b/Cargo.lock
index e9e434c5..375eec92 100644
--- a/Cargo.lock
+++ b/Cargo.lock
@@ -34,7 +34,7 @@ checksum = "baf1de4339761588bc0619e3cbc0120ee582ebb74b53b4efbf79117bd2da40fd"
 
 [[package]]
 name = "create-o7-app"
-version = "0.2.1"
+version = "0.2.2"
 dependencies = [
  "anyhow",
  "crossterm 0.26.0",
diff --git a/Cargo.toml b/Cargo.toml
index 1bb7f14c..2bff5af4 100644
--- a/Cargo.toml
+++ b/Cargo.toml
@@ -1,6 +1,6 @@
 [package]
 name = "create-o7-app"
-version = "0.2.1"
+version = "0.2.2"
 edition = "2021"
 
 # See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html
diff --git a/template_builder/templates/base/src/routes/+page.svelte b/template_builder/templates/base/src/routes/+page.svelte
index f6f17620..dce4aa10 100644
--- a/template_builder/templates/base/src/routes/+page.svelte
+++ b/template_builder/templates/base/src/routes/+page.svelte
@@ -1 +1,63 @@
-<h1>You are using the o7 stack</h1>
+<script lang="ts">
+	import NextStep from '$lib/components/NextStep.svelte';
+</script>
+
+<main>
+	<img src="/favicon.png" width="128px" alt="o7 Logo" />
+	<h1>Welcome to the o7 stack!</h1>
+	<h2>Next Steps:</h2>
+	<div class="steps">
+		<NextStep
+			title="Edit this page"
+			learnMore="https://svelte.dev/tutorial/basics"
+		>
+			<p>
+				Edit <code class="lime">src/routes/+page.svelte</code> to see your changes
+				live.
+			</p>
+			<p>
+				The source for these cards is in <code class="lime"
+					>src/lib/components/NextStep.svelte</code
+				>.
+			</p>
+			<p>
+				There's some global styling in <code class="lime">src/app.css</code>.
+			</p>
+		</NextStep>
+	</div>
+</main>
+
+<style>
+	main {
+		display: flex;
+		height: 100vh;
+		flex-direction: column;
+		align-items: center;
+		justify-content: center;
+	}
+	h1 {
+		font-size: 1.875rem;
+		line-height: 2.25rem;
+		font-weight: 700;
+	}
+	h2 {
+		margin-top: 1.5rem;
+		margin-bottom: 1.5rem;
+		font-size: 1.5rem;
+		line-height: 2rem;
+	}
+	.steps {
+		display: flex;
+		justify-content: center;
+		max-width: 64rem;
+		gap: 1rem;
+		padding: 0 0.75rem;
+	}
+	.lime {
+		color: rgb(190 242 100);
+	}
+	code {
+		background: rgb(24 24 27);
+		padding: 0.125rem;
+	}
+</style>
diff --git a/template_builder/templates/extras/src/routes/{Database}+page.svelte b/template_builder/templates/extras/src/routes/{Database}+page.svelte
index 21642990..c5f84d37 100644
--- a/template_builder/templates/extras/src/routes/{Database}+page.svelte
+++ b/template_builder/templates/extras/src/routes/{Database}+page.svelte
@@ -12,7 +12,7 @@
 			learnMore="https://svelte.dev/tutorial/basics"
 		>
 			<p>
-				Edit <code class="lime"> src/routes/+page.svelte </code> to see your changes
+				Edit <code class="lime">src/routes/+page.svelte</code> to see your changes
 				live.
 			</p>
 			<p>
@@ -32,7 +32,7 @@
 				Write a Prisma schema in <code class="red">prisma/schema.prisma</code>.
 			</p>
 			<p>
-				Run <code class="red"> pnpm db:push </code> to update your database typings.
+				Run <code class="red">pnpm db:push</code> to update your database typings.
 			</p>
 			<p>
 				Remember that you're using <a
diff --git a/template_builder/templates/extras/src/routes/{Tailwind,Database}+page.svelte b/template_builder/templates/extras/src/routes/{Tailwind,Database}+page.svelte
index eaed3956..fefd31e6 100644
--- a/template_builder/templates/extras/src/routes/{Tailwind,Database}+page.svelte
+++ b/template_builder/templates/extras/src/routes/{Tailwind,Database}+page.svelte
@@ -12,8 +12,8 @@
 			learnMore="https://svelte.dev/tutorial/basics"
 		>
 			<p>
-				Edit <code class="text-lime-300"> src/routes/+page.svelte </code> to see
-				your changes live.
+				Edit <code class="text-lime-300">src/routes/+page.svelte</code> to see your
+				changes live.
 			</p>
 			<p>
 				The source for these cards is in <code class="text-lime-300"
@@ -36,7 +36,7 @@
 				>.
 			</p>
 			<p>
-				Run <code class="text-red-300"> pnpm db:push </code> to update your database
+				Run <code class="text-red-300">pnpm db:push</code> to update your database
 				typings.
 			</p>
 			<p>
diff --git a/template_builder/templates/extras/src/routes/{Tailwind,Trpc,Database}+page.svelte b/template_builder/templates/extras/src/routes/{Tailwind,Trpc,Database}+page.svelte
index 613ebdec..e9cb576a 100644
--- a/template_builder/templates/extras/src/routes/{Tailwind,Trpc,Database}+page.svelte
+++ b/template_builder/templates/extras/src/routes/{Tailwind,Trpc,Database}+page.svelte
@@ -19,8 +19,8 @@
 			learnMore="https://svelte.dev/tutorial/basics"
 		>
 			<p>
-				Edit <code class="text-lime-300"> src/routes/+page.svelte </code> to see
-				your changes live.
+				Edit <code class="text-lime-300">src/routes/+page.svelte</code> to see your
+				changes live.
 			</p>
 			<p>
 				The source for these cards is in <code class="text-lime-300"
@@ -43,7 +43,7 @@
 				>.
 			</p>
 			<p>
-				Run <code class="text-red-300"> pnpm db:push </code> to update your database
+				Run <code class="text-red-300">pnpm db:push</code> to update your database
 				typings.
 			</p>
 			<p>
diff --git a/template_builder/templates/extras/src/routes/{Tailwind,Trpc}+page.svelte b/template_builder/templates/extras/src/routes/{Tailwind,Trpc}+page.svelte
index 714f65e8..46d2d73b 100644
--- a/template_builder/templates/extras/src/routes/{Tailwind,Trpc}+page.svelte
+++ b/template_builder/templates/extras/src/routes/{Tailwind,Trpc}+page.svelte
@@ -19,8 +19,8 @@
 			learnMore="https://svelte.dev/tutorial/basics"
 		>
 			<p>
-				Edit <code class="text-lime-300"> src/routes/+page.svelte </code> to see
-				your changes live.
+				Edit <code class="text-lime-300">src/routes/+page.svelte</code> to see your
+				changes live.
 			</p>
 			<p>
 				The source for these cards is in <code class="text-lime-300"
diff --git a/template_builder/templates/extras/src/routes/{Tailwind}+page.svelte b/template_builder/templates/extras/src/routes/{Tailwind}+page.svelte
index 78baa5ee..5454dce3 100644
--- a/template_builder/templates/extras/src/routes/{Tailwind}+page.svelte
+++ b/template_builder/templates/extras/src/routes/{Tailwind}+page.svelte
@@ -12,8 +12,8 @@
 			learnMore="https://svelte.dev/tutorial/basics"
 		>
 			<p>
-				Edit <code class="text-lime-300"> src/routes/+page.svelte </code> to see
-				your changes live.
+				Edit <code class="text-lime-300">src/routes/+page.svelte</code> to see your
+				changes live.
 			</p>
 			<p>
 				The source for these cards is in <code class="text-lime-300"
diff --git a/template_builder/templates/extras/src/routes/{Trpc,Database}+page.svelte b/template_builder/templates/extras/src/routes/{Trpc,Database}+page.svelte
index b9eedf73..d7c578b0 100644
--- a/template_builder/templates/extras/src/routes/{Trpc,Database}+page.svelte
+++ b/template_builder/templates/extras/src/routes/{Trpc,Database}+page.svelte
@@ -19,7 +19,7 @@
 			learnMore="https://svelte.dev/tutorial/basics"
 		>
 			<p>
-				Edit <code class="lime"> src/routes/+page.svelte </code> to see your changes
+				Edit <code class="lime">src/routes/+page.svelte</code> to see your changes
 				live.
 			</p>
 			<p>
diff --git a/template_builder/templates/extras/src/routes/{Trpc}+page.svelte b/template_builder/templates/extras/src/routes/{Trpc}+page.svelte
index 134e4806..215f4160 100644
--- a/template_builder/templates/extras/src/routes/{Trpc}+page.svelte
+++ b/template_builder/templates/extras/src/routes/{Trpc}+page.svelte
@@ -19,7 +19,7 @@
 			learnMore="https://svelte.dev/tutorial/basics"
 		>
 			<p>
-				Edit <code class="lime"> src/routes/+page.svelte </code> to see your changes
+				Edit <code class="lime">src/routes/+page.svelte</code> to see your changes
 				live.
 			</p>
 			<p>