diff --git a/_src/_assets/javascripts/page-front.js b/_src/_assets/javascripts/page-front.js
index 4e8e122..a18eac4 100644
--- a/_src/_assets/javascripts/page-front.js
+++ b/_src/_assets/javascripts/page-front.js
@@ -1,2 +1,19 @@
 
 //=include bigchain/smoothscroll.js
+//=include ../../../node_modules/vivus/dist/vivus.js
+
+
+jQuery(function($) {
+
+    // graph animation
+    var iconOptions = {
+        type: 'delayed',
+        start: 'inViewport',
+        duration: 200,
+        animTimingFunction: Vivus.EASE_OUT,
+        selfDestroy: true
+    };
+
+    new Vivus('bigchain-graph', iconOptions);
+
+});
diff --git a/_src/_assets/styles/page-front.scss b/_src/_assets/styles/page-front.scss
index fca17cb..b7d77a9 100644
--- a/_src/_assets/styles/page-front.scss
+++ b/_src/_assets/styles/page-front.scss
@@ -5,12 +5,6 @@
 //
 
 .section-features {
-
-    figure {
-        display: block;
-        margin-bottom: ($spacer * 2);
-    }
-
     .icon {
         display: block;
         margin: auto;
@@ -18,6 +12,23 @@
     }
 }
 
+.graph-bigchain {
+    display: block;
+    margin-bottom: ($spacer * 2);
+
+
+}
+
+// the SVG
+#bigchain-graph {
+    @media ($screen-md) {
+        margin-left: -10%;
+        margin-right: -10%;
+        width: 120%;
+    }
+
+}
+
 .section-features__main {
     @extend .text-center;
     margin-top: $spacer;
diff --git a/_src/_includes/scripts.html b/_src/_includes/scripts.html
index 157a49f..b6ddf62 100644
--- a/_src/_includes/scripts.html
+++ b/_src/_includes/scripts.html
@@ -9,6 +9,8 @@
 
 {% if page.js %}
 <script src="/assets/js/{{ page.js }}"></script>
+{% elsif layout.js %}
+<script src="/assets/js/{{ layout.js }}"></script>
 {% endif %}
 
 <!--
diff --git a/_src/_includes/svg/graph-bigchain.svg b/_src/_includes/svg/graph-bigchain.svg
new file mode 100644
index 0000000..25a8aa3
--- /dev/null
+++ b/_src/_includes/svg/graph-bigchain.svg
@@ -0,0 +1,47 @@
+<svg id="bigchain-graph" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 656.18 194.29">
+  <defs>
+    <style>
+      .cls-1, .cls-2 {
+        fill: none;
+      }
+
+      .cls-1 {
+        stroke: #BFE6EC;
+        stroke-miterlimit: 10;
+        stroke-opacity: .2;
+      }
+
+      .cls-2 {
+        stroke: #54c695;
+        stroke-linecap: round;
+        stroke-linejoin: round;
+        stroke-width: 2px;
+      }
+
+      .cls-3 {
+        fill: #bfe6ec;
+      }
+    </style>
+  </defs>
+  <title>graph-bigchain</title>
+  <g id="lines">
+    <line class="cls-1" x1="25.18" y1="31.66" x2="655.18" y2="31.66"/>
+    <line class="cls-1" x1="25.18" y1="111.66" x2="655.18" y2="111.66"/>
+    <line class="cls-1" x1="25.18" y1="191" x2="655.18" y2="191"/>
+  </g>
+  <polyline id="graph" class="cls-2" points="19.59 21.09 23.72 18.38 28.45 26.52 46.51 42.66 54.18 42.66 59.84 71.25 73.18 44.77 85.84 52.39 97.18 30.36 103.18 48.35 111.18 41.67 123.84 49.67 135.18 37.67 143.84 29 150.51 44.64 155.18 37.01 161.84 44.66 172.18 44.66 175.84 28.58 180.51 35.79 189.18 33.06 195.18 35.7 201.84 49.68 213.18 57.01 221.18 57.67 239.84 44.59 248.51 65 255.18 39 261.18 44.58 272.51 40.33 280.51 48.33 285.84 63 291.84 44.58 297.18 57.66 305.18 61 310.51 44.58 317.84 41 322.51 27.66 333.84 40.33 338.51 41 348.51 21.66 355.84 38.33 362.51 27.66 368.18 41.66 375.18 41 381.18 32.33 389.84 34.33 397.18 50.33 401.18 36.33 409.84 38.33 414.51 44.58 422.51 50.33 427.18 64.33 435.18 54.33 442.01 58.33 452.18 51 452.18 38.66 463.59 36.33 471.05 38.33 476.45 49 483.15 44.63 503.16 65.67 517.84 40.33 523.84 48.33 537.18 39.66 549.18 27 557.18 30.83 563.18 38.66 569.18 38.66 573.84 41.91 585.84 27.79 593.84 29.73 601.18 23.7 605.18 33.01 611.84 18.39 617.84 26.34 625.84 1 633.84 27 645.18 5 655.18 21.66"/>
+  <g id="labels-y">
+    <g>
+      <path class="cls-3" d="M2.2,35.12H1.55V29.55l-1.15,1L0,30.08l1.62-1.33H2.2v6.37Z"/>
+      <path class="cls-3" d="M6.8,28.59a1.64,1.64,0,0,1,1,.29,2.14,2.14,0,0,1,.64.77,3.72,3.72,0,0,1,.35,1.08,7.19,7.19,0,0,1,.1,1.22,7.11,7.11,0,0,1-.1,1.22,3.72,3.72,0,0,1-.35,1.07,2.1,2.1,0,0,1-.64.76,1.65,1.65,0,0,1-1,.29,1.67,1.67,0,0,1-1-.29,2.1,2.1,0,0,1-.64-0.76,3.63,3.63,0,0,1-.34-1.07,7.47,7.47,0,0,1-.1-1.22,7.55,7.55,0,0,1,.1-1.22,3.63,3.63,0,0,1,.34-1.08,2.15,2.15,0,0,1,.64-0.77A1.65,1.65,0,0,1,6.8,28.59Zm0,0.55a1,1,0,0,0-.7.26,1.82,1.82,0,0,0-.44.67,3.67,3.67,0,0,0-.23.9,7.8,7.8,0,0,0-.06,1,7.69,7.69,0,0,0,.06,1,3.59,3.59,0,0,0,.23.9,1.78,1.78,0,0,0,.44.66,1,1,0,0,0,.7.26,1,1,0,0,0,.7-0.26,1.79,1.79,0,0,0,.44-0.66,3.72,3.72,0,0,0,.23-0.9,7.12,7.12,0,0,0,.07-1,7.22,7.22,0,0,0-.07-1,3.8,3.8,0,0,0-.23-0.9,1.83,1.83,0,0,0-.44-0.67A1,1,0,0,0,6.8,29.14Z"/>
+      <path class="cls-3" d="M12,28.59a1.64,1.64,0,0,1,1,.29,2.14,2.14,0,0,1,.64.77A3.72,3.72,0,0,1,14,30.72a7.19,7.19,0,0,1,.1,1.22,7.11,7.11,0,0,1-.1,1.22,3.72,3.72,0,0,1-.35,1.07A2.1,2.1,0,0,1,13,35a1.65,1.65,0,0,1-1,.29A1.67,1.67,0,0,1,11,35a2.1,2.1,0,0,1-.64-0.76A3.63,3.63,0,0,1,10,33.17a7.47,7.47,0,0,1-.1-1.22,7.55,7.55,0,0,1,.1-1.22,3.63,3.63,0,0,1,.34-1.08A2.15,2.15,0,0,1,11,28.88,1.65,1.65,0,0,1,12,28.59Zm0,0.55a1,1,0,0,0-.7.26,1.82,1.82,0,0,0-.44.67,3.67,3.67,0,0,0-.23.9,7.8,7.8,0,0,0-.06,1,7.69,7.69,0,0,0,.06,1,3.59,3.59,0,0,0,.23.9,1.78,1.78,0,0,0,.44.66,1,1,0,0,0,.7.26,1,1,0,0,0,.7-0.26,1.79,1.79,0,0,0,.44-0.66,3.72,3.72,0,0,0,.23-0.9,7.12,7.12,0,0,0,.07-1,7.22,7.22,0,0,0-.07-1,3.8,3.8,0,0,0-.23-0.9,1.83,1.83,0,0,0-.44-0.67A1,1,0,0,0,12,29.14Z"/>
+      <path class="cls-3" d="M16.13,31.61h0l3-2.86H20.1l-3.21,2.89,3.39,3.48h-1l-3.19-3.39h0v3.39H15.48V28.75h0.65v2.86Z"/>
+    </g>
+    <g>
+      <path class="cls-3" d="M8.47,108.33H5.81l0,2a2.44,2.44,0,0,1,.44-0.11,2.8,2.8,0,0,1,.44,0,2.3,2.3,0,0,1,.83.14,2,2,0,0,1,.66.41,1.83,1.83,0,0,1,.43.63,2.09,2.09,0,0,1,.15.81,2.35,2.35,0,0,1-.15.85,1.93,1.93,0,0,1-1.1,1.12,2.22,2.22,0,0,1-.86.16A2.08,2.08,0,0,1,5.44,114a2.1,2.1,0,0,1-.74-0.85l0.58-.26a1.43,1.43,0,0,0,.52.63,1.34,1.34,0,0,0,.77.23,1.58,1.58,0,0,0,.6-0.11,1.4,1.4,0,0,0,.47-0.32A1.45,1.45,0,0,0,8,112.82a1.69,1.69,0,0,0,0-1.24,1.41,1.41,0,0,0-.33-0.48,1.49,1.49,0,0,0-.5-0.31,1.8,1.8,0,0,0-.63-0.11,2.49,2.49,0,0,0-.68.09,3.24,3.24,0,0,0-.64.26l0.06-3.29H8.47v0.58Z"/>
+      <path class="cls-3" d="M12,107.59a1.63,1.63,0,0,1,1,.29,2.15,2.15,0,0,1,.64.76,3.72,3.72,0,0,1,.35,1.08,7.26,7.26,0,0,1,0,2.44,3.71,3.71,0,0,1-.35,1.07A2.09,2.09,0,0,1,13,114a1.65,1.65,0,0,1-1,.29,1.67,1.67,0,0,1-1-.29,2.1,2.1,0,0,1-.64-0.76,3.62,3.62,0,0,1-.34-1.07,7.62,7.62,0,0,1,0-2.44,3.63,3.63,0,0,1,.34-1.08,2.15,2.15,0,0,1,.64-0.76A1.65,1.65,0,0,1,12,107.59Zm0,0.55a1,1,0,0,0-.7.26,1.81,1.81,0,0,0-.44.67,3.66,3.66,0,0,0-.23.9,7.8,7.8,0,0,0-.06,1,7.68,7.68,0,0,0,.06,1,3.59,3.59,0,0,0,.23.9,1.78,1.78,0,0,0,.44.66,1,1,0,0,0,.7.26,1,1,0,0,0,.7-0.26,1.78,1.78,0,0,0,.44-0.66,3.72,3.72,0,0,0,.23-0.9,7.11,7.11,0,0,0,.07-1,7.22,7.22,0,0,0-.07-1,3.79,3.79,0,0,0-.23-0.9,1.82,1.82,0,0,0-.44-0.67A1,1,0,0,0,12,108.14Z"/>
+      <path class="cls-3" d="M16.13,110.61h0l3-2.86H20.1l-3.21,2.89,3.39,3.48h-1l-3.19-3.39h0v3.39H15.48v-6.37h0.65v2.86Z"/>
+    </g>
+    <path class="cls-3" d="M17.56,187.59a1.63,1.63,0,0,1,1,.29,2.15,2.15,0,0,1,.64.76,3.72,3.72,0,0,1,.35,1.08,7.26,7.26,0,0,1,0,2.44,3.71,3.71,0,0,1-.35,1.07,2.09,2.09,0,0,1-.64.76,1.65,1.65,0,0,1-1,.29,1.67,1.67,0,0,1-1-.29,2.1,2.1,0,0,1-.64-0.76,3.62,3.62,0,0,1-.34-1.07,7.62,7.62,0,0,1,0-2.44,3.63,3.63,0,0,1,.34-1.08,2.15,2.15,0,0,1,.64-0.76A1.65,1.65,0,0,1,17.56,187.59Zm0,0.55a1,1,0,0,0-.7.26,1.81,1.81,0,0,0-.44.67,3.66,3.66,0,0,0-.23.9,7.8,7.8,0,0,0-.06,1,7.68,7.68,0,0,0,.06,1,3.59,3.59,0,0,0,.23.9,1.78,1.78,0,0,0,.44.66,1,1,0,0,0,.7.26,1,1,0,0,0,.7-0.26,1.78,1.78,0,0,0,.44-0.66,3.72,3.72,0,0,0,.23-0.9,7.11,7.11,0,0,0,.07-1,7.22,7.22,0,0,0-.07-1,3.79,3.79,0,0,0-.23-0.9,1.82,1.82,0,0,0-.44-0.67A1,1,0,0,0,17.56,188.14Z"/>
+  </g>
+</svg>
diff --git a/_src/index.html b/_src/index.html
index 66b10b5..5b07172 100644
--- a/_src/index.html
+++ b/_src/index.html
@@ -1,11 +1,11 @@
 ---
 layout: base
 
-front_page: true
-
 tagline:    'Meet BigchainDB, the world’s most scalable blockchain database'
 
+front_page: true
 hero_video_name: northern-light
+js: page-front.min.js
 ---
 
 {% include hero-video.html %}
@@ -19,8 +19,8 @@ hero_video_name: northern-light
             </p>
         </header>
 
-        <figure>
-            <img class="img--responsive" src="/assets/img/graph.png" width="672" height="226">
+        <figure class="graph-bigchain img--responsive">
+            {% include svg/graph-bigchain.svg %}
         </figure>
 
         <div class="section-features__main grid grid--full grid-small--fit grid--gutters">
diff --git a/package.json b/package.json
index 2a8ff6a..483f651 100644
--- a/package.json
+++ b/package.json
@@ -18,7 +18,8 @@
     "normalize-css": ">=2.3.1",
     "normalize-opentype.css": ">=0.2.4",
     "parsleyjs": "^2.0.7",
-    "svg4everybody": "^2.0.0"
+    "svg4everybody": "^2.0.0",
+    "vivus": "^0.2.2"
   },
   "devDependencies": {
     "browser-sync": ">=2.10.0",