diff --git a/ui/src/App.vue b/ui/src/App.vue
index e22c14a..c32e536 100644
--- a/ui/src/App.vue
+++ b/ui/src/App.vue
@@ -1,9 +1,7 @@
 <template>
   <v-app>
     <v-main>
-      <TitleBar>
-        <div v-html="title_html" />
-      </TitleBar>
+      <TitleBar :title="title_html" />
       <HelloWorld />
     </v-main>
     <TickerBar :content="ticker_html" />
diff --git a/ui/src/components/TitleBar.vue b/ui/src/components/TitleBar.vue
index b1239d3..1c50ba7 100644
--- a/ui/src/components/TitleBar.vue
+++ b/ui/src/components/TitleBar.vue
@@ -5,9 +5,10 @@
         <THWLogo :above="logo_above" :below="logo_below" />
       </div>
 
-      <div class="d-flex justify-center text-center mx-auto text-h6 text-md-h5">
-        <slot> <h1>TITLE</h1> </slot>
-      </div>
+      <div
+        class="d-flex justify-center text-center mx-auto text-h6 text-md-h5"
+        v-html="title"
+      />
 
       <div class="d-none d-sm-flex justify-end text-right text-no-wrap">
         <div class="flex-column">
@@ -46,6 +47,11 @@ export default class TitleBar extends Vue {
     default: "OV Musterstadt",
   })
   public logo_below!: string;
+
+  @Prop({
+    default: "TITLE",
+  })
+  public title!: string;
 }
 </script>