diff --git a/src/components/PlainSnippet.astro b/src/components/PlainSnippet.astro
new file mode 100644
index 0000000..56d6132
--- /dev/null
+++ b/src/components/PlainSnippet.astro
@@ -0,0 +1,18 @@
+---
+interface Props {
+  code: string;
+}
+
+const { code } = Astro.props;
+---
+
+{/* For blocks that are not Flix - terminal output, TOML - which CodeSnippet
+    would colour through the Flix grammar. Reuses that component's frame, so a
+    plain block and a highlighted one stack in a column without a seam.
+    overflow-x is set here because Astro's <Code> ships it inline on the <pre>
+    it renders, and a bare <pre> has nothing. */}
+<div class="code-snippet-frame">
+  <div class="code-snippet-code">
+    <pre style="overflow-x: auto">{code}</pre>
+  </div>
+</div>
diff --git a/src/lib/indexExamples.js b/src/lib/indexExamples.js
index 63a1a8c..6645173 100644
--- a/src/lib/indexExamples.js
+++ b/src/lib/indexExamples.js
@@ -327,9 +327,9 @@ def testDivide01(): Unit \\ Assert =
 def testDivide02(): Unit \\ Assert =
     assertErr(divide(10, 0))`;
 
-// Terminal output rather than Flix, so the home page renders this one through a
-// plain <pre>: the CodeSnippet component only knows the Flix grammar and would
-// colour the PASS lines as if they were code.
+// Neither this nor the two that follow are Flix, so the home page renders them
+// with PlainSnippet: CodeSnippet only knows the Flix grammar and would colour
+// terminal output and TOML as if they were code.
 export const testOutput = `Running 2 tests...
 
    PASS  testDivide01 1.4ms
@@ -337,6 +337,26 @@ export const testOutput = `Running 2 tests...
 
 Passed: 2, Failed: 0. Skipped: 0. Elapsed: 2.1ms.`;
 
+export const manifestExample = `[package]
+name        = "hello-world"
+description = "A simple Flix package"
+version     = "0.1.0"
+license     = "Apache-2.0"
+
+[dependencies]
+"github:flix/museum" = "1.4.0"
+
+[mvn-dependencies]
+"org.apache.commons:commons-lang3" = "3.12.0"`;
+
+export const manifestOutput = `Found \`flix.toml'. Checking dependencies...
+Resolving Flix dependencies...
+  Downloading \`flix/museum.toml\` (v1.4.0)... OK.
+  Downloading \`flix/museum.fpkg\` (v1.4.0)... OK.
+Resolving Maven dependencies...
+  Adding \`org.apache.commons:commons-lang3' (3.12.0).
+Dependency resolution completed.`;
+
 export const datalogExample = `def reachable(g: List[(String, Int32, String)], minSpeed: Int32): List[(String, String)] =
     let facts = inject g into Road/3;
     let rules = #{
diff --git a/src/pages/index.astro b/src/pages/index.astro
index 496596e..e64ef55 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -1,6 +1,7 @@
 ---
 import Layout from "../layouts/Layout.astro";
 import CodeSnippet from "../components/CodeSnippet.astro";
+import PlainSnippet from "../components/PlainSnippet.astro";
 import Carousel from "../components/Carousel.astro";
 import {
   httpExample,
@@ -25,6 +26,8 @@ import {
   terminationExample,
   testExample,
   testOutput,
+  manifestExample,
+  manifestOutput,
   datalogExample,
 } from "../lib/indexExamples.js";
 
@@ -551,6 +554,44 @@ const vscodeSlides = [
     </div>
 
     <div class="row mb-4">
+      <div class="col-md-6">
+        <div class="card border-0">
+          <div class="card-body">
+            <div class="card-title"><h4>Build and Package Management</h4></div>
+            <p class="card-text">
+              Flix has its own build tool and package manager. A project is
+              described by a single <code>flix.toml</code> manifest, shown on
+              the right, and <code>flix init</code> writes the first one for
+              you.
+            </p>
+            <p class="card-text">
+              Dependencies are Flix packages published on GitHub, or JARs
+              published on Maven &mdash; so pulling in the Java ecosystem is one
+              line in the manifest. Flix resolves both, transitively, and
+              downloads them on the next build.
+            </p>
+            <p class="card-text">
+              The commands <code>check</code>, <code>build</code>, <code
+                >run</code
+              >, <code>test</code>, <code>build-fatjar</code>, and <code
+                >release</code
+              > are built into the compiler itself, and each one works from the command
+              line, from the REPL, and from Visual Studio Code.
+            </p>
+          </div>
+        </div>
+      </div>
+      <div class="col-md-6">
+        <PlainSnippet code={manifestExample} />
+        <PlainSnippet code={manifestOutput} />
+      </div>
+    </div>
+
+    <div class="row mb-4">
+      <div class="col-md-6">
+        <CodeSnippet code={testExample} />
+        <PlainSnippet code={testOutput} />
+      </div>
       <div class="col-md-6">
         <div class="card border-0">
           <div class="card-body">
@@ -574,17 +615,6 @@ const vscodeSlides = [
           </div>
         </div>
       </div>
-      <div class="col-md-6">
-        <CodeSnippet code={testExample} />
-        {/* Terminal output, not Flix, so it bypasses CodeSnippet and reuses
-            only its frame. overflow-x is set here because Astro's <Code> ships
-            that inline on the <pre> it renders and a bare one has nothing. */}
-        <div class="code-snippet-frame">
-          <div class="code-snippet-code">
-            <pre style="overflow-x: auto">{testOutput}</pre>
-          </div>
-        </div>
-      </div>
     </div>
 
     <div class="row mb-4">