diff --git a/pages/about.html b/pages/about.html
new file mode 100644
index 0000000..f0c5d05
--- /dev/null
+++ b/pages/about.html
@@ -0,0 +1,6 @@
+<h2>this is my about page</h2>
+<p>i think</p>
+<br>
+<p>i'm hippoz.</p>
+<p>i sometimes work on projects.</p>
+<p>i think i like javascript, node, c, c++, html, and some other stuff.</p>
\ No newline at end of file
diff --git a/pages/contact.html b/pages/contact.html
new file mode 100644
index 0000000..5f0c06d
--- /dev/null
+++ b/pages/contact.html
@@ -0,0 +1,5 @@
+<h2>you can contact me</h2>
+<p>i think</p>
+<br>
+<p>my email is hippoz@hippoz.xyz</p>
+<p>i might respond.</p>
\ No newline at end of file
diff --git a/pages/home.html b/pages/home.html
index 05a682b..a396aec 100644
--- a/pages/home.html
+++ b/pages/home.html
@@ -1 +1,4 @@
-Hello!
\ No newline at end of file
+<h2>this is my homepage</h2>
+<p>i think</p>
+<br>
+<p>i'm hippoz. i sometimes do stuff.</p>
\ No newline at end of file
diff --git a/res/index.js b/res/index.js
index 534545c..702e142 100644
--- a/res/index.js
+++ b/res/index.js
@@ -12,10 +12,19 @@ const onButtonClick = (buttonId) => {
             window.location.href = 'https://git.hippoz.xyz/'
             break;
         }
+        case 'button-about-me': {
+            A('#content-container').load('/pages/about.html');
+            break;
+        }
+        case 'button-contact-me': {
+            A('#content-container').load('/pages/contact.html');
+            break;
+        }
     }
 };
 
 A(() => {
+    A('#content-container').load('/pages/home.html');
     A('.navigation-buttons .button-default').each((el) => {
         A(el).on('click', () => {
             onButtonClick(el.id);