diff --git a/README.md b/README.md
index f841553ad..3870714cc 100644
--- a/README.md
+++ b/README.md
@@ -4,7 +4,7 @@ Open-source, AI-native design editor. Figma-compatible, AI-first, fully local.
 
 > **Status:** Active development. Not ready for production use.
 
-![OpenPencil](screenshot.png)
+![OpenPencil](packages/docs/public/screenshot.png)
 
 ## Why
 
diff --git a/packages/docs/.vitepress/theme/HomeLayout.vue b/packages/docs/.vitepress/theme/HomeLayout.vue
new file mode 100644
index 000000000..99c7ee503
--- /dev/null
+++ b/packages/docs/.vitepress/theme/HomeLayout.vue
@@ -0,0 +1,33 @@
+<script setup lang="ts">
+import DefaultTheme from 'vitepress/theme'
+import { useData } from 'vitepress'
+
+const { Layout } = DefaultTheme
+const { frontmatter } = useData()
+</script>
+
+<template>
+  <Layout>
+    <template #home-hero-after>
+      <div v-if="frontmatter.layout === 'home'" class="screenshot">
+        <img
+          src="/screenshot.png"
+          alt="OpenPencil editor with a Material 3 design file open"
+        />
+      </div>
+    </template>
+  </Layout>
+</template>
+
+<style scoped>
+.screenshot {
+  max-width: 1152px;
+  margin: 0 auto;
+  padding: 0 24px;
+}
+
+.screenshot img {
+  width: 100%;
+  border-radius: 12px;
+}
+</style>
diff --git a/packages/docs/.vitepress/theme/index.ts b/packages/docs/.vitepress/theme/index.ts
new file mode 100644
index 000000000..6cf910272
--- /dev/null
+++ b/packages/docs/.vitepress/theme/index.ts
@@ -0,0 +1,7 @@
+import DefaultTheme from 'vitepress/theme'
+import HomeLayout from './HomeLayout.vue'
+
+export default {
+  extends: DefaultTheme,
+  Layout: HomeLayout,
+}
diff --git a/packages/docs/index.md b/packages/docs/index.md
index 3fb936b9b..6fea1cbe4 100644
--- a/packages/docs/index.md
+++ b/packages/docs/index.md
@@ -6,9 +6,6 @@ hero:
   name: OpenPencil
   text: AI-Native Design Editor
   tagline: Open-source Figma alternative. Fully local, AI-native, programmable.
-  image:
-    src: /screenshot.png
-    alt: OpenPencil editor with a Material 3 design file open
   actions:
     - theme: brand
       text: Get Started
diff --git a/packages/docs/public/screenshot.png b/packages/docs/public/screenshot.png
index fc7402e22..a788288eb 100644
Binary files a/packages/docs/public/screenshot.png and b/packages/docs/public/screenshot.png differ
diff --git a/screenshot.png b/screenshot.png
deleted file mode 100644
index fc7402e22..000000000
Binary files a/screenshot.png and /dev/null differ