diff --git a/docs/css/extra.css b/docs/css/extra.css
index 1d1b281..9afcca4 100644
--- a/docs/css/extra.css
+++ b/docs/css/extra.css
@@ -22,6 +22,23 @@ h4 {
   padding-top:10px;
 }
 
+.index-ghcup-hero {
+  display: flex;
+  flex-direction: row;
+  justify-content: center;
+  align-items: center;
+}
+
+.index-ghcup-hero img {
+  width: 10%;
+  min-width: 110px;
+  max-width: 120px;
+  border: none;
+  margin: 0;
+}
+
+.index-ghcup-hero h1 {
+}
 
 div.col-md-9 h1:first-of-type {
   text-align: center;
diff --git a/docs/index.md b/docs/index.md
index 46729fa..f7fb284 100644
--- a/docs/index.md
+++ b/docs/index.md
@@ -8,7 +8,10 @@ hide:
 <script src="javascripts/extra.js"></script>
 
 
-# ![](./haskell_logo.png){: .main-logo style="width:100px"} GHCup
+<section class="index-ghcup-hero">
+  <img alt="haskell logo" src="./haskell_logo.png" />
+  <h1>GHCup</h1>
+</section>
 
 <p class="ghcup-intro">GHCup is an installer for the general purpose language <a href="https://www.haskell.org">Haskell</a>.</p>