diff --git a/src/components/navigation/navigation.scss b/src/components/navigation/navigation.scss
index 18b84b4..ecab413 100644
--- a/src/components/navigation/navigation.scss
+++ b/src/components/navigation/navigation.scss
@@ -63,6 +63,17 @@
         height: 70%;
         margin-right: 10px;
     }
+
+    #nav-logo-text
+    {
+        // Color
+        -webkit-background-clip: text !important;
+        -webkit-text-fill-color: transparent;
+        color: #6bbeff;
+        background: linear-gradient(90deg,
+                rgba(90,177,239,1) 0%,
+                rgba(25,212,174,1) 100%);
+    }
 }
 
 #next-course
diff --git a/src/components/navigation/navigation.vue b/src/components/navigation/navigation.vue
index d489a5c..c1d351e 100644
--- a/src/components/navigation/navigation.vue
+++ b/src/components/navigation/navigation.vue
@@ -5,7 +5,7 @@
 
             <div id="nav-title">
                 <img id="nav-logo" alt="logo" src="../../assets/logo.png">
-                Veracross Analyzer
+                <span id="nav-logo-text">Veracross Analyzer</span>
             </div>
 
             <el-menu-item index="overall">Overall</el-menu-item>