diff --git a/components/app_bar/config.css b/components/app_bar/config.css
index ca3ba1b4..a3851e20 100644
--- a/components/app_bar/config.css
+++ b/components/app_bar/config.css
@@ -1,6 +1,8 @@
 :root {
   --appbar-color: var(--color-primary-dark);
   --appbar-contrast: var(--color-primary-contrast);
+  --appbar-title-font-size: calc(2 * var(--unit));
+  --appbar-title-font-weight: 500;
   --appbar-title-total-distance: calc(8 * var(--unit));
   --appbar-height: calc(6.4 * var(--unit));
   --appbar-height-m-portrait: calc(5.6 * var(--unit));
diff --git a/components/app_bar/theme.css b/components/app_bar/theme.css
index 8b9282b4..3f183681 100644
--- a/components/app_bar/theme.css
+++ b/components/app_bar/theme.css
@@ -54,16 +54,11 @@
 
 .title {
   flex-grow: 1;
-  font-size: calc(1.8 * var(--unit));
-  font-weight: bold;
+  font-size: var(--appbar-title-font-size);
+  font-weight: var(--appbar-title-font-weight);
   overflow-x: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
-
-  & > small {
-    font-size: calc(1.8 * var(--unit));
-    font-weight: normal;
-  }
 }
 
 .leftIcon {