diff --git a/src/scss/components/_character_values.scss b/src/scss/components/_character_values.scss
index ea698994..7b6ec7d6 100644
--- a/src/scss/components/_character_values.scss
+++ b/src/scss/components/_character_values.scss
@@ -62,28 +62,28 @@ header.sheet-header {
                     background-size: contain;
                     font-size: 1.5em;
                     &.hitPoints {
-                        background-image: url("assets/official/DS4-HP.png");
+                        background-image: url("#{$official-assets-path}/DS4-HP.png");
                     }
                     &.defense {
-                        background-image: url("assets/official/DS4-DEF.png");
+                        background-image: url("#{$official-assets-path}/DS4-DEF.png");
                     }
                     &.initiative {
-                        background-image: url("assets/official/DS4-INI.png");
+                        background-image: url("#{$official-assets-path}/DS4-INI.png");
                     }
                     &.movement {
-                        background-image: url("assets/official/DS4-MR.png");
+                        background-image: url("#{$official-assets-path}/DS4-MR.png");
                     }
                     &.meleeAttack {
-                        background-image: url("assets/official/DS4-MAT.png");
+                        background-image: url("#{$official-assets-path}/DS4-MAT.png");
                     }
                     &.rangedAttack {
-                        background-image: url("assets/official/DS4-RAT.png");
+                        background-image: url("#{$official-assets-path}/DS4-RAT.png");
                     }
                     &.spellcasting {
-                        background-image: url("assets/official/DS4-SPC.png");
+                        background-image: url("#{$official-assets-path}/DS4-SPC.png");
                     }
                     &.targetedSpellcasting {
-                        background-image: url("assets/official/DS4-TSC.png");
+                        background-image: url("#{$official-assets-path}/DS4-TSC.png");
                     }
                 }
 
diff --git a/src/scss/utils/_variables.scss b/src/scss/utils/_variables.scss
index 6b5cbd78..e077f7a2 100644
--- a/src/scss/utils/_variables.scss
+++ b/src/scss/utils/_variables.scss
@@ -4,3 +4,5 @@ $padding-lg: 20px;
 $margin-sm: $padding-sm;
 $margin-md: $padding-md;
 $margin-lg: $padding-lg;
+
+$official-assets-path: "assets/official";