diff --git a/app/src/frontend/legend.css b/app/src/frontend/legend.css
index c1190aad..694091fd 100644
--- a/app/src/frontend/legend.css
+++ b/app/src/frontend/legend.css
@@ -10,7 +10,7 @@
     float: right;
     background: white;
     border-radius: 4px;
-    padding: 0.5rem 0 0.25rem;
+    padding: 0.5rem 0rem 0.25rem;
     border: 1px solid #fff;
     box-shadow: 0px 0px 1px 1px #222222;
 }
@@ -24,7 +24,6 @@
         bottom: 24px;
     }
 }
-.map-legend h3,
 .map-legend h4,
 .data-legend {
     padding: 0 0.5rem;
diff --git a/app/src/frontend/legend.js b/app/src/frontend/legend.js
index 442afca3..9881c488 100644
--- a/app/src/frontend/legend.js
+++ b/app/src/frontend/legend.js
@@ -105,7 +105,32 @@ const Legend = (props) => {
     const elements = details.elements;
     return (
         <div className="map-legend">
-            <h3 className="h3 logotype">Colouring London</h3>
+            <div className="logo">
+                <div className="grid">
+                    <div className="row">
+                        <div className="cell"></div>
+                        <div className="cell"></div>
+                        <div className="cell"></div>
+                        <div className="cell"></div>
+                    </div>
+                    <div className="row">
+                        <div className="cell"></div>
+                        <div className="cell"></div>
+                        <div className="cell"></div>
+                        <div className="cell"></div>
+                    </div>
+                    <div className="row">
+                        <div className="cell"></div>
+                        <div className="cell"></div>
+                        <div className="cell"></div>
+                        <div className="cell"></div>
+                    </div>
+                </div>
+                <h3 className="h3 logotype">
+                    <span>Colouring</span>
+                    <span>London</span>
+                </h3>
+            </div>
             <h4 className="h4">{ title }</h4>
             {
                 elements.length?
diff --git a/app/src/frontend/logo.css b/app/src/frontend/logo.css
index 7c70e220..053be1ca 100644
--- a/app/src/frontend/logo.css
+++ b/app/src/frontend/logo.css
@@ -27,6 +27,20 @@
     font-size: 0.625em;
     letter-spacing: 0;
 }
+.map-legend .logo {
+    margin-top: -5px;
+    padding: 0 0.4rem 0.4rem 0.4rem;
+}
+.map-legend .logo .logotype {
+    position: relative;
+    top: 6px;
+}
+.map-legend .logo .row .cell {
+    background-color: #ccc;
+    height: 11px;
+    width: 11px;
+    animation: none !important;
+}
 .logo .grid {
     position: relative;
     top: -1px;