diff --git a/quartz/components/styles/explorer.scss b/quartz/components/styles/explorer.scss
index 304fd4500..34f180cf2 100644
--- a/quartz/components/styles/explorer.scss
+++ b/quartz/components/styles/explorer.scss
@@ -1,3 +1,5 @@
+@use "../../styles/variables.scss" as *;
+
 button#explorer {
   all: unset;
   background-color: transparent;
@@ -85,7 +87,7 @@ svg {
     color: var(--secondary);
     font-family: var(--headerFont);
     font-size: 0.95rem;
-    font-weight: 600;
+    font-weight: $boldWeight;
     line-height: 1.5rem;
     display: inline-block;
   }
@@ -110,7 +112,7 @@ svg {
       font-size: 0.95rem;
       display: inline-block;
       color: var(--secondary);
-      font-weight: 600;
+      font-weight: $boldWeight;
       margin: 0;
       line-height: 1.5rem;
       pointer-events: none;
diff --git a/quartz/components/styles/search.scss b/quartz/components/styles/search.scss
index aac01bed5..1471a77cb 100644
--- a/quartz/components/styles/search.scss
+++ b/quartz/components/styles/search.scss
@@ -138,7 +138,7 @@
           font-family: inherit;
           color: var(--dark);
           line-height: 1.5em;
-          font-weight: 400;
+          font-weight: $normalWeight;
           background: var(--light);
           border-top-right-radius: 5px;
           border-bottom-right-radius: 5px;
@@ -198,7 +198,7 @@
               padding: 0.2rem 0.4rem;
               margin: 0 0.1rem;
               line-height: 1.4rem;
-              font-weight: bold;
+              font-weight: $boldWeight;
               color: var(--secondary);
 
               &.match-tag {
diff --git a/quartz/styles/base.scss b/quartz/styles/base.scss
index 0fa7a5567..a4fde0639 100644
--- a/quartz/styles/base.scss
+++ b/quartz/styles/base.scss
@@ -54,7 +54,7 @@ ul,
 }
 
 a {
-  font-weight: 600;
+  font-weight: $boldWeight;
   text-decoration: none;
   transition: color 0.2s ease;
   color: var(--secondary);
diff --git a/quartz/styles/callouts.scss b/quartz/styles/callouts.scss
index ee62e39c5..d4f7069a0 100644
--- a/quartz/styles/callouts.scss
+++ b/quartz/styles/callouts.scss
@@ -1,3 +1,4 @@
+@use "./variables.scss" as *;
 @use "sass:color";
 
 .callout {
@@ -156,6 +157,6 @@
   }
 
   .callout-title-inner {
-    font-weight: 700;
+    font-weight: $boldWeight;
   }
 }
diff --git a/quartz/styles/variables.scss b/quartz/styles/variables.scss
index db43f8ed9..8384b9c4e 100644
--- a/quartz/styles/variables.scss
+++ b/quartz/styles/variables.scss
@@ -4,3 +4,5 @@ $tabletBreakpoint: 1000px;
 $sidePanelWidth: 380px;
 $topSpacing: 6rem;
 $fullPageWidth: $pageWidth + 2 * $sidePanelWidth;
+$boldWeight: 700;
+$normalWeight: 400;