diff --git a/frontend/index.html b/frontend/index.html
index 28ff0a3..b951890 100644
--- a/frontend/index.html
+++ b/frontend/index.html
@@ -3,7 +3,11 @@
   <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover" />
-    <title>skeps</title>
+    <title>Skeps</title>
+
+    <link rel="preconnect" href="https://fonts.googleapis.com" />
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
+    <link href="https://fonts.googleapis.com/css2?family=Quicksand:wght@600;700&display=swap" rel="stylesheet" />
 
     <link rel="icon" href="/favicon.png" type="image/png" />
     <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
diff --git a/frontend/src/App.vue b/frontend/src/App.vue
index a436623..ea99dde 100644
--- a/frontend/src/App.vue
+++ b/frontend/src/App.vue
@@ -757,13 +757,13 @@ onMounted(init)
   <main v-if="loading"></main>
 
   <main v-else-if="notFound">
-    <h1>skeps</h1>
+    <h1>Skeps</h1>
     <p>That list doesn't exist.</p>
     <a href="/">Create a new list</a>
   </main>
 
   <main v-else>
-    <h1>skeps</h1>
+    <h1>Skeps</h1>
 
     <template v-for="group in groups" :key="groupKey(group)">
       <div
@@ -1062,6 +1062,10 @@ main {
   padding: calc(env(safe-area-inset-top) + 1rem) 1rem env(safe-area-inset-bottom);
   font-family: sans-serif;
 }
+h1 {
+  font-family: 'Quicksand', sans-serif;
+  font-weight: 700;
+}
 .add-item-row {
   padding: 0.5rem 0.35rem;
 }