diff --git a/frontend/styles/variables.scss b/frontend/styles/variables.scss
index da5fe60..60b5c3a 100644
--- a/frontend/styles/variables.scss
+++ b/frontend/styles/variables.scss
@@ -1,21 +1,49 @@
-$primary: #b7debd;
+body {
+  --primary: #b7debd;
 
-$light-green: #c8f9df;
-$green: #0be881;
-$dark-green: #0ed277;
+  --light-green: #c8f9df;
+  --green: #0be881;
+  --dark-green: #0ed277;
 
-$light-blue: #d4f2fe;
-$blue: #4bcffa;
-$dark-blue: #24acda;
+  --light-blue: #d4f2fe;
+  --blue: #4bcffa;
+  --dark-blue: #24acda;
 
-$light-yellow: #fff6d6;
-$yellow: #ffde5d;
-$dark-yellow: #ecc31d;
+  --light-yellow: #fff6d6;
+  --yellow: #ffde5d;
+  --dark-yellow: #ecc31d;
 
-$light-red: #fbd7de;
-$red: #ef5878;
-$dark-red: #ec3b61;
+  --light-red: #fbd7de;
+  --red: #ef5878;
+  --dark-red: #ec3b61;
 
-$link-color: #ff5fff;
+  --link-color: #ff5fff;
+  --underlinenav-text: #e1e4e8;
+  --underlinenav-text-active: #f9826c;
+  --underlinenav-text-hover: #d1d5da;
 
-$matte-text-color: #333333;
\ No newline at end of file
+  --matte-text-color: #333333;
+}
+
+$primary: var(--primary);
+
+$light-green: var(--light-green);
+$green: var(--green);
+$dark-green: var(--dark-green);
+
+$light-blue: var(--light-blue);
+$blue: var(--blue);
+$dark-blue: var(--dark-blue);
+
+$light-yellow: var(--light-yellow);
+$yellow: var(--yellow);
+$dark-yellow: var(--dark-yellow);
+
+$light-red: var(--light-red);
+$red: var(--red);
+$dark-red: var(--dark-red);
+
+$link-color: var(--link-color);
+$underlinenav-text-active: var(--underlinenav-text-active);
+
+$matte-text-color: var(--matte-text-color);