diff --git a/angular.json b/angular.json
index 06c690f..ce52da4 100644
--- a/angular.json
+++ b/angular.json
@@ -42,6 +42,9 @@
               },
               {
                 "input": "src/global.scss"
+              },
+              {
+                "input": "src/assets/font/fonts.css"
               }
             ],
             "scripts": []
diff --git a/src/app/app.component.html b/src/app/app.component.html
index 6f5b51a..ab7c803 100644
--- a/src/app/app.component.html
+++ b/src/app/app.component.html
@@ -3,7 +3,7 @@
     <ion-menu class="sidebar" contentId="main-content" content="content" type="push" side="start">
       <ion-header>
         <ion-toolbar color="primary">
-          <ion-title>{{ appName }}
+          <ion-title style="font-weight: bold; color: white;">{{ appName }}
             <ion-menu-toggle menu="first" autoHide="false"></ion-menu-toggle>
           </ion-title>
         </ion-toolbar>
diff --git a/src/assets/font/Raleway-Bold.ttf b/src/assets/font/Raleway-Bold.ttf
new file mode 100644
index 0000000..8763231
Binary files /dev/null and b/src/assets/font/Raleway-Bold.ttf differ
diff --git a/src/assets/font/Raleway-Light.ttf b/src/assets/font/Raleway-Light.ttf
new file mode 100644
index 0000000..43aa156
Binary files /dev/null and b/src/assets/font/Raleway-Light.ttf differ
diff --git a/src/assets/font/Raleway-Regular.ttf b/src/assets/font/Raleway-Regular.ttf
new file mode 100644
index 0000000..acb5715
Binary files /dev/null and b/src/assets/font/Raleway-Regular.ttf differ
diff --git a/src/assets/font/fonts.css b/src/assets/font/fonts.css
new file mode 100644
index 0000000..a5a57f3
--- /dev/null
+++ b/src/assets/font/fonts.css
@@ -0,0 +1,17 @@
+@font-face {
+    font-family: 'Raleway';
+    src: url('./Raleway-Regular.ttf');
+    font-weight: normal;
+}
+
+@font-face {
+    font-family: 'Raleway';
+    src: url('./Raleway-Light.ttf');
+    font-weight: 100;
+}
+
+@font-face {
+    font-family: 'Raleway';
+    src: url('./Raleway-Bold.ttf');
+    font-weight: bold;
+}
diff --git a/src/theme/variables.scss b/src/theme/variables.scss
index 48e5b11..9413f7c 100644
--- a/src/theme/variables.scss
+++ b/src/theme/variables.scss
@@ -3,6 +3,8 @@
 
 /** Ionic CSS Variables **/
 :root {
+  --ion-font-family: 'Raleway';
+
   /** primary **/
   --ion-color-primary: #3880ff;
   --ion-color-primary-rgb: 56, 128, 255;