diff --git a/frontend/client/components/Home/Intro.less b/frontend/client/components/Home/Intro.less
index 1082ccb3..e6bcea83 100644
--- a/frontend/client/components/Home/Intro.less
+++ b/frontend/client/components/Home/Intro.less
@@ -96,11 +96,15 @@
   }
 
   &-illustration {
+    position: relative;
+    width: 100%;
     max-width: 640px;
+    background-size: contain;
 
-    img {
-      width: 100%;
-      height: auto;
+    &:after {
+      content: '';
+      display: block;
+      padding-top: 86.3%; // Aspect ratio of img
     }
 
     @media @thin-query {
diff --git a/frontend/client/components/Home/Intro.tsx b/frontend/client/components/Home/Intro.tsx
index 37d96bf4..e804acf1 100644
--- a/frontend/client/components/Home/Intro.tsx
+++ b/frontend/client/components/Home/Intro.tsx
@@ -32,9 +32,10 @@ const HomeIntro: React.SFC<Props> = ({ t, authUser }) => (
         </a>
       </div>
     </div>
-    <div className="HomeIntro-illustration">
-      <img src={HomeIllustration} />
-    </div>
+    <div
+      className="HomeIntro-illustration"
+      style={{ backgroundImage: `url(${HomeIllustration})` }}
+    />
   </div>
 );