diff --git a/app/javascript/packs/application.js b/app/javascript/packs/application.js
index 770e18d83..c3c2f6d58 100644
--- a/app/javascript/packs/application.js
+++ b/app/javascript/packs/application.js
@@ -32,7 +32,7 @@ require('../src/styles/base.scss');
 
 importAll(require.context('../src/javascripts', true, /\.js(\.erb)?$/));
 
-require.context("../../../public/images/favicons", true)
+require.context("../../../public/images", true)
 
 export { default as Artist } from '../src/javascripts/artist.js';
 export { default as Autocomplete } from '../src/javascripts/autocomplete.js.erb';
diff --git a/app/javascript/src/styles/common/blacklists.scss b/app/javascript/src/styles/common/blacklists.scss
index 54b6518d8..95dda8dc5 100644
--- a/app/javascript/src/styles/common/blacklists.scss
+++ b/app/javascript/src/styles/common/blacklists.scss
@@ -76,7 +76,7 @@
     height: 0px !important;
     width: 0px !important;
     padding: 150px 150px 0px 0px !important;
-    background: url("images/blacklisted-preview.png") !important;
+    background: url("blacklisted-preview.png") !important;
 
     @media screen and (max-width: 800px) {
       background-size: 100px !important;
diff --git a/app/javascript/src/styles/common/page_header.scss b/app/javascript/src/styles/common/page_header.scss
index b0777f37d..30556071e 100644
--- a/app/javascript/src/styles/common/page_header.scss
+++ b/app/javascript/src/styles/common/page_header.scss
@@ -12,7 +12,7 @@
     grid-area: logo;
 
     margin-top: 6px;
-    background-image: url("images/main-logo.png");
+    background-image: url("main-logo.png");
     background-repeat: no-repeat;
     background-size: contain;
     background-position-y: center;
diff --git a/app/javascript/src/styles/common/z_responsive.scss b/app/javascript/src/styles/common/z_responsive.scss
index b20212cd4..d5fa7a659 100644
--- a/app/javascript/src/styles/common/z_responsive.scss
+++ b/app/javascript/src/styles/common/z_responsive.scss
@@ -292,7 +292,7 @@
             display: inline-block;
             padding: 6px 10px;
 
-            background-image: url("images/main-logo.png");
+            background-image: url("main-logo.png");
             background-repeat: no-repeat;
             background-size: contain;
 
diff --git a/app/javascript/src/styles/themes/_extra_aurora.scss b/app/javascript/src/styles/themes/_extra_aurora.scss
index 4ba85efbc..8b3caf6df 100644
--- a/app/javascript/src/styles/themes/_extra_aurora.scss
+++ b/app/javascript/src/styles/themes/_extra_aurora.scss
@@ -1,5 +1,5 @@
 body[data-th-extra="aurora"] {
-  --image-foreground: url("images/themes/extras/aurora.png");
+  --image-foreground: url("themes/extras/aurora.png");
   --image-foreground-position: left top;
   --image-foreground-repeat: repeat-x;
 }
diff --git a/app/javascript/src/styles/themes/_extra_autumn.scss b/app/javascript/src/styles/themes/_extra_autumn.scss
index ba6d46238..a5e64df88 100644
--- a/app/javascript/src/styles/themes/_extra_autumn.scss
+++ b/app/javascript/src/styles/themes/_extra_autumn.scss
@@ -1,5 +1,5 @@
 body[data-th-extra="autumn"] {
-  --image-foreground: url("images/themes/extras/leaves_bottom.png");
+  --image-foreground: url("themes/extras/leaves_bottom.png");
   --image-foreground-position: left bottom;
   --image-foreground-repeat: repeat-x;
   --content-padding-bottom: 6rem;
diff --git a/app/javascript/src/styles/themes/_extra_hexagons.scss b/app/javascript/src/styles/themes/_extra_hexagons.scss
index ebaebae3b..e55a1b15a 100644
--- a/app/javascript/src/styles/themes/_extra_hexagons.scss
+++ b/app/javascript/src/styles/themes/_extra_hexagons.scss
@@ -1,5 +1,5 @@
 body {
-  --image-foreground: url("images/themes/extras/hex.png");
+  --image-foreground: url("themes/extras/hex.png");
   --image-foreground-position: left top;
   --image-foreground-repeat: repeat-x;
   --content-padding-bottom: 0.5rem;
diff --git a/app/javascript/src/styles/themes/_extra_space.scss b/app/javascript/src/styles/themes/_extra_space.scss
index 5df124645..08aaa448f 100644
--- a/app/javascript/src/styles/themes/_extra_space.scss
+++ b/app/javascript/src/styles/themes/_extra_space.scss
@@ -1,5 +1,5 @@
 body[data-th-extra="space"] {
-  --image-foreground: url("images/themes/extras/space.png");
+  --image-foreground: url("themes/extras/space.png");
   --image-foreground-position: left top;
   --image-foreground-repeat: repeat-x;
 }
diff --git a/app/javascript/src/styles/themes/_extra_spring.scss b/app/javascript/src/styles/themes/_extra_spring.scss
index 1de6f8e91..bbb8b770a 100644
--- a/app/javascript/src/styles/themes/_extra_spring.scss
+++ b/app/javascript/src/styles/themes/_extra_spring.scss
@@ -1,8 +1,8 @@
 body[data-th-extra="spring"] {
-  --image-foreground: url("images/themes/extras/spring_bottom.png"),
-                      url("images/themes/extras/spring_bottom_fox.png"),
-                      url("images/themes/extras/spring_top.png"),
-                      url("images/themes/extras/spring_top_sky.png");
+  --image-foreground: url("themes/extras/spring_bottom.png"),
+                      url("themes/extras/spring_bottom_fox.png"),
+                      url("themes/extras/spring_top.png"),
+                      url("themes/extras/spring_top_sky.png");
   --image-foreground-position: left bottom, right bottom ,right top ,left top;
   --image-foreground-repeat: repeat-x, no-repeat, no-repeat, repeat-x;
   --content-padding-bottom: 3rem;
diff --git a/app/javascript/src/styles/themes/_extra_stars.scss b/app/javascript/src/styles/themes/_extra_stars.scss
index 81c9f3612..cec0ea811 100644
--- a/app/javascript/src/styles/themes/_extra_stars.scss
+++ b/app/javascript/src/styles/themes/_extra_stars.scss
@@ -1,5 +1,5 @@
 body[data-th-extra="stars"] {
-  --image-foreground: url("images/themes/extras/stars.png");
+  --image-foreground: url("themes/extras/stars.png");
   --image-foreground-position: left top;
   --image-foreground-repeat: repeat-x;
 }
diff --git a/app/javascript/src/styles/themes/_extra_winter.scss b/app/javascript/src/styles/themes/_extra_winter.scss
index 9ff96e353..65ce84313 100644
--- a/app/javascript/src/styles/themes/_extra_winter.scss
+++ b/app/javascript/src/styles/themes/_extra_winter.scss
@@ -1,6 +1,6 @@
 body[data-th-extra="winter"] {
-  --image-foreground: url("images/themes/extras/snow_bottom.png"),
-                      url("images/themes/extras/snow_top.png");
+  --image-foreground: url("themes/extras/snow_bottom.png"),
+                      url("themes/extras/snow_top.png");
   --image-foreground-position: left bottom, left top;
   --image-foreground-repeat: repeat-x;
   --content-padding-bottom: 3rem;
diff --git a/app/javascript/src/styles/themes/_theme_hexagon.scss b/app/javascript/src/styles/themes/_theme_hexagon.scss
index 8a737da86..7b262f62e 100644
--- a/app/javascript/src/styles/themes/_theme_hexagon.scss
+++ b/app/javascript/src/styles/themes/_theme_hexagon.scss
@@ -9,7 +9,7 @@ $hexagon-color-section-border:    $hexagon-color-background;
 
 body {
   // Theme-specific images
-  --image-background:             url("images/themes/hexagon/background.png");
+  --image-background:             url("themes/hexagon/background.png");
 
   // Layout Colors
   --color-background:             #{$hexagon-color-background}; // Main background (dark blue, large hexagons)
diff --git a/config/webpacker.yml b/config/webpacker.yml
index be834fad5..c5ff6ec31 100644
--- a/config/webpacker.yml
+++ b/config/webpacker.yml
@@ -11,7 +11,11 @@ default: &default
   # Additional paths webpack should look up modules
   # ['app/assets', 'engine/foo/app/assets']
   additional_paths:
-    - public
+    # Make the files available in css
+    - public/images
+    # Actually have webpacker add them to its digest so that assets:precompile works properly
+    # Modifying these files when only used with require.context did not pick up changes
+    - public/images/**/*
 
   # Reload manifest.json on all requests so we reload latest compiled packs
   cache_manifest: false