diff --git a/public/images/artist-registration-photo.jpg b/public/images/artist-registration-photo.jpg
new file mode 100644
index 00000000..dc526087
Binary files /dev/null and b/public/images/artist-registration-photo.jpg differ
diff --git a/public/images/charity-registration-photo.jpg b/public/images/charity-registration-photo.jpg
new file mode 100644
index 00000000..523df70c
Binary files /dev/null and b/public/images/charity-registration-photo.jpg differ
diff --git a/public/images/user-registration-photo.jpg b/public/images/user-registration-photo.jpg
new file mode 100644
index 00000000..2c2d397d
Binary files /dev/null and b/public/images/user-registration-photo.jpg differ
diff --git a/src/containers/Home/Home.js b/src/containers/Home/Home.js
index 4bc8c947..495c1dab 100644
--- a/src/containers/Home/Home.js
+++ b/src/containers/Home/Home.js
@@ -3,37 +3,91 @@ import React, { Component } from 'react'
 class Home extends Component {
   render() {
     return (
-      <div className="home-container">
-        <div className="intro-text">
-          <h1 className="intro-heading">Drive the change with music</h1>
-          <p className="intro-paragraph">
-            Sing for Needs is a donation platform, which connects music
-            performances with inspiring causes to create change together with
-            the fans
-          </p>
-          <button className="intro-cta">Get started with Sing for Needs</button>
-          <p className="intro-usp">
-            Join over 100,000 artists, causes and changemakers
-          </p>
-        </div>
-        <div className="intro-visuals">
-          <img
-            id="image-1"
-            src="images/polaroid-sing-for-needs-1.jpg"
-            alt="Singer on the chair -- from Unsplash.com"
-          />
-          <img
-            id="image-2"
-            src="images/polaroid-sing-for-needs-2.jpg"
-            alt="Singer on the chair -- from Unsplash.com"
-          />
-          <img
-            id="image-3"
-            src="images/polaroid-sing-for-needs-3.jpg"
-            alt="Singer on the chair -- from Unsplash.com"
-          />
-        </div>
-      </div>
+      <React.Fragment>
+        <section className="home-container__intro">
+          <div className="intro-text">
+            <h1 className="intro-heading">Drive the change with music</h1>
+            <p className="intro-paragraph">
+              Sing for Needs is a donation platform, which connects music
+              performances with inspiring causes to create change together with
+              the fans
+            </p>
+            <button className="intro-cta">
+              Get started with Sing for Needs
+            </button>
+            <p className="intro-usp body-small">
+              Join over 100,000 artists, causes and changemakers
+            </p>
+          </div>
+          <div className="intro-visuals">
+            <img
+              id="image-1"
+              src="images/polaroid-sing-for-needs-1.jpg"
+              alt="Singer on the chair -- from Unsplash.com"
+            />
+            <img
+              id="image-2"
+              src="images/polaroid-sing-for-needs-2.jpg"
+              alt="Singer on the chair -- from Unsplash.com"
+            />
+            <img
+              id="image-3"
+              src="images/polaroid-sing-for-needs-3.jpg"
+              alt="Singer on the chair -- from Unsplash.com"
+            />
+          </div>
+        </section>
+        <section className="home-container__registration">
+          <h2 className="heading">How to get started?</h2>
+          <p className="intro">Choose from the options available below</p>
+          <div className="registration-options">
+            <div className="registration-option-card">
+              <div className="registration-details">
+                <img
+                  src="/images/user-registration-photo.jpg"
+                  alt="A couple at the festival"
+                />
+                <h4>I'm a fan, music lover</h4>
+                <p className="description">
+                  I'm looking for the latest music, explore the new and happy to
+                  support my favourite artists and helping the cause important
+                  to them.
+                </p>
+              </div>
+              <button>Register as a music fan</button>
+            </div>
+            <div className="registration-option-card">
+              <div className="registration-details">
+                <img
+                  src="/images/artist-registration-photo.jpg"
+                  alt="Singer with a microphone representing a musician"
+                />
+                <h4>I'm a musician</h4>
+                <p className="description">
+                  I'm looking forward to make positive impact on the world, help
+                  the charities to close to my mindset and engage with fans.
+                </p>
+              </div>
+              <button>Register as an artist</button>
+            </div>
+            <div className="registration-option-card">
+              <div className="registration-details">
+                <img
+                  src="/images/charity-registration-photo.jpg"
+                  alt="Woman smiling representing a charity"
+                />
+                <h4>I'm running a charity</h4>
+                <p className="description">
+                  I'm looking forward to establish good associations and share a
+                  mission with an artist to help growing the tribe around the
+                  cause we're supporting.
+                </p>
+              </div>
+              <button>Register as a charity</button>
+            </div>
+          </div>
+        </section>
+      </React.Fragment>
     )
   }
 }
diff --git a/src/containers/Home/Home.scss b/src/containers/Home/Home.scss
index 97b2a91d..50628b7a 100644
--- a/src/containers/Home/Home.scss
+++ b/src/containers/Home/Home.scss
@@ -1,4 +1,4 @@
-.home-container {
+.home-container__intro {
   display: flex;
   justify-content: space-between;
   flex-direction: column;
@@ -43,6 +43,8 @@
     margin-bottom: $margin-l;
 
     p.intro-usp {
+      margin-top: $margin-xs;
+      margin-bottom: $margin-xxl;
       color: $primary-color-white-darkest;
     }
   }
@@ -54,12 +56,11 @@
     align-items: center;
     position: relative;
     width: 100%;
-    height: 350px;
     margin-top: $margin-xxl;
 
     img {
       position: absolute;
-      width: 50%;
+      width: 52%;
       box-shadow: 0 19px 38px rgba($primary-color-darkblue-lighter, 0.3),
         0 15px 12px rgba($primary-color-darkblue-lighter, 0.22);
     }
@@ -99,8 +100,81 @@
   }
 }
 
+.home-container__registration {
+  flex-direction: column;
+  grid-column: 1/-1;
+  margin-top: $margin-xxl;
+  margin-bottom: $margin-xxl;
+  padding-top: $padding-xl;
+
+  h2 {
+    color: $primary-color-white;
+    text-align: center;
+    margin-bottom: $margin-s;
+  }
+
+  p.intro {
+    color: $primary-color-white-darkest;
+    text-align: center;
+  }
+
+  .registration-options {
+    width: 100%;
+    padding-top: $padding-xl;
+    display: flex;
+    flex-direction: column;
+    justify-content: space-around;
+
+    .registration-option-card {
+      display: flex;
+      flex-direction: column;
+      width: 100%;
+      background-color: $primary-color-darkblue-lighter;
+      padding-bottom: $padding-s;
+      border-bottom-left-radius: 16px;
+      border-bottom-right-radius: 16px;
+      border: 1px solid $primary-color-darkblue-lightest;
+      transition: border 300ms ease;
+      box-shadow: 0 19px 38px rgba($primary-color-darkblue-lighter, 0.3),
+        0 15px 12px rgba($primary-color-darkblue-lighter, 0.22);
+      margin-bottom: $margin-l;
+
+      &:last-of-type {
+        margin-bottom: 0;
+      }
+
+      img {
+        width: 100%;
+      }
+
+      h4 {
+        width: 100%;
+        color: $primary-color-white;
+        padding-top: $padding-s;
+        padding-left: $padding-s;
+      }
+
+      .description {
+        padding: $padding-s;
+        color: $primary-color-white;
+      }
+
+      button {
+        margin-left: $margin-s;
+        margin-right: $margin-s;
+        width: fit-content;
+      }
+
+      &:hover {
+        cursor: pointer;
+        border: 1px solid $primary-color-white-darkest;
+      }
+    }
+  }
+}
+
 @media only screen and (min-width: 576px) {
-  .home-container {
+  .home-container__intro {
     .intro-text {
       margin-bottom: $margin-xxl;
     }
@@ -114,7 +188,7 @@
 }
 
 @media only screen and (min-width: 992px) {
-  .home-container {
+  .home-container__intro {
     flex-direction: row;
 
     button {
@@ -130,6 +204,7 @@
         font-style: normal;
         font-size: 4.209rem;
         line-height: 0.9;
+        width: 95%;
       }
 
       p {
@@ -141,7 +216,7 @@
       width: 50%;
 
       img {
-        width: 50%;
+        width: 58%;
       }
 
       #image-1 {
@@ -156,4 +231,35 @@
       }
     }
   }
+
+  .home-container__registration {
+    margin-top: $margin-s;
+    padding-top: 0;
+
+    .registration-options {
+      width: 100%;
+      padding-top: $padding-xl;
+      display: flex;
+      flex-direction: row;
+      justify-content: space-around;
+
+      .registration-option-card {
+        width: 28%;
+        margin-bottom: 0;
+        justify-content: space-between;
+
+        h4 {
+          width: 100%;
+          color: $primary-color-white;
+          padding-top: $padding-s;
+          padding-left: $padding-s;
+        }
+
+        .description {
+          padding: $padding-s;
+          color: $primary-color-white;
+        }
+      }
+    }
+  }
 }
diff --git a/src/containers/Home/Home.test.js b/src/containers/Home/Home.test.js
index 00b9e787..7c44ac17 100644
--- a/src/containers/Home/Home.test.js
+++ b/src/containers/Home/Home.test.js
@@ -17,10 +17,24 @@ describe('<Home />', () => {
   })
 
   it('contains a call to action button', () => {
-    expect(homeWrapper.find('button').length).toEqual(1)
+    expect(homeWrapper.find('.home-container__intro button').length).toEqual(1)
   })
 
   it('contains 3 mood images about artists', () => {
-    expect(homeWrapper.find('img').length).toEqual(3)
+    expect(homeWrapper.find('.home-container__intro img').length).toEqual(3)
+  })
+
+  it('contains a section about how to register', () => {
+    expect(homeWrapper.find('.home-container__registration').length).toEqual(1)
+  })
+
+  it('contains 3 possible registration opportunities', () => {
+    expect(homeWrapper.find('.registration-option-card').length).toEqual(3)
+  })
+
+  it('each of the 3 cards has a button which leads to the registration accordingly', () => {
+    expect(homeWrapper.find('.registration-option-card button').length).toEqual(
+      3
+    )
   })
 })
diff --git a/src/styles/_typography.scss b/src/styles/_typography.scss
index 4297d6d3..6bbd2325 100644
--- a/src/styles/_typography.scss
+++ b/src/styles/_typography.scss
@@ -12,6 +12,14 @@ body {
   line-height: 1.35;
 }
 
+.body-small {
+  font-family: "proxima-nova", sans-serif;
+  font-weight: 100;
+  font-style: normal;
+  font-size: 14px;
+  line-height: 1.35;
+}
+
 // HEADINGS -- PROXIMA NOVA EXTRABOLD
 
 h1,