diff --git a/public/portrait.jpg b/public/portrait.jpg
new file mode 100644
index 0000000..9c529b1
Binary files /dev/null and b/public/portrait.jpg differ
diff --git a/public/portrait.png b/public/portrait.png
deleted file mode 100644
index 95007bc..0000000
Binary files a/public/portrait.png and /dev/null differ
diff --git a/src/pages/about.md b/src/content/about.md
similarity index 76%
rename from src/pages/about.md
rename to src/content/about.md
index a5bb64e..33b7eb2 100644
--- a/src/pages/about.md
+++ b/src/content/about.md
@@ -1,16 +1,9 @@
----
-layout: ../layouts/Layout.astro
-title: "About"
----
-
-## Hello World!
-
-![](/portrait.png)
-
-My name is Graham Hall, a web developer from Rhode Island.
+My name is **Graham**, a web developer from Rhode Island.
 
 When I'm not writing code, I'm usually enjoying one of my other hobbies; video games, music, hiking, photography, art, the list goes on...
 
 I write about web development on [my other blog](https://ghall.dev/blog), but I wanted an outlet to write about some of my other interests. So, I put together this site to share whatever's on my mind about the world of tech, gaming, life, whatever strikes my fancy.
 
 If you want to get in touch, I'm on [Mastodon](https://home.social/@ghalldev).
+
+My portrait was done by [Natalia Vazquez](https://www.nataliavazquezgarcia.com).
diff --git a/src/pages/about.astro b/src/pages/about.astro
new file mode 100644
index 0000000..4a59762
--- /dev/null
+++ b/src/pages/about.astro
@@ -0,0 +1,18 @@
+---
+import Layout from "../layouts/Layout.astro";
+import AboutText from "../content/about.md";
+
+const styles = {
+  img: {
+    display: "block",
+    maxWidth: "300px",
+    margin: "auto",
+    marginBottom: "26px",
+  },
+};
+---
+
+<Layout title="About">
+  <img src="/portrait.jpg" alt="me" style={styles.img} />
+  <AboutText />
+</Layout>