diff --git a/app/javascript/six/assets/computer.jpg b/app/javascript/six/assets/computer.jpg
new file mode 100644
index 00000000..2367517f
Binary files /dev/null and b/app/javascript/six/assets/computer.jpg differ
diff --git a/app/javascript/six/front/hero.scss b/app/javascript/six/front/hero.scss
index 9d261154..3ec96741 100644
--- a/app/javascript/six/front/hero.scss
+++ b/app/javascript/six/front/hero.scss
@@ -1,12 +1,18 @@
 .fronthero {
-  background-image: url("assets/hero.png");
-  background-color: var(--makigas-brand-darker);
-  background-repeat: repeat;
+  background-image: url("assets/computer.jpg");
+  background-repeat: no-repeat;
+  background-position: center;
+  background-size: cover;
   color: white;
   padding-top: 6rem;
   padding-bottom: 4rem;
   text-align: center;
 
+  @include desktop-layout {
+    padding-top: 10rem;
+    padding-bottom: 8rem;
+  }
+
   &__title {
     font-family: var(--font-title);
     font-size: 1.5rem;
diff --git a/esbuild.mjs b/esbuild.mjs
index 188d09d7..df694940 100644
--- a/esbuild.mjs
+++ b/esbuild.mjs
@@ -12,6 +12,7 @@ const options = {
   target: ["es2020"],
   platform: "browser",
   loader: {
+    ".jpg": "file",
     ".png": "file",
     ".svg": "file",
     ".woff": "file",