diff --git a/src/components/hy-introduction/hy-introduction.scss b/src/components/hy-introduction/hy-introduction.scss
index 36607fc375a71b048390b5a91397b7a10b0eff8a..d6ddbac5756d80058097d87da4ab3018361b7c94 100644
--- a/src/components/hy-introduction/hy-introduction.scss
+++ b/src/components/hy-introduction/hy-introduction.scss
@@ -3,6 +3,12 @@
 }
 
 .hy-introduction {
+  &__content {
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+  }
+
   &--reversed {
     .hy-introduction__outer-content {
       align-items: flex-end;
diff --git a/src/index.html b/src/index.html
index 712a51eeb6041163f155b491cf69315275b91455..6193d4b4519bf6e7bcc7722a41744a5bb0232b18 100644
--- a/src/index.html
+++ b/src/index.html
@@ -211,7 +211,40 @@
               <hy-paragraph-text>Accordion content</hy-paragraph-text>
             </hy-accordion-item>
           </hy-accordion-container>
-
+          <hy-introduction
+            variant="blue"
+            text-title="This is an introduction"
+            text-description="Highly cited researchers at the University of Helsinki, Centres of Excellence selected by the Academy of Finland and projects funded by the European Research Council."
+            url="https://www.google.com"
+            url-title="Check this link"
+            sc-label="label for link"
+            image-url="https://www.helsinki.fi/sites/default/files/styles/16_9_huge/public/kukkataedit_ja_-sedaet-6_0.jpg"
+          ></hy-introduction>
+          <hy-introduction
+            variant="black"
+            text-title="This is an introduction"
+            text-description="Highly cited researchers at the University of Helsinki, Centres of Excellence selected by the Academy of Finland and projects funded by the European Research Council."
+            url="https://www.google.com"
+            url-title="Check this link"
+            sc-label="label for link"
+            image-url="https://www.helsinki.fi/sites/default/files/styles/16_9_huge/public/kukkataedit_ja_-sedaet-6_0.jpg"
+          ></hy-introduction>
+          <hy-introduction
+            reversed
+            text-title="This is an introduction"
+            text-description="Highly cited researchers at the University of Helsinki, Centres of Excellence selected by the Academy of Finland and projects funded by the European Research Council."
+            url="https://www.google.com"
+            url-title="Check this link"
+            sc-label="label for link"
+            image-url="https://www.helsinki.fi/sites/default/files/styles/16_9_huge/public/kukkataedit_ja_-sedaet-6_0.jpg"
+          ></hy-introduction>
+          <hy-introduction
+            text-title="This is an introduction"
+            text-description="Highly cited researchers at the University of Helsinki, Centres of Excellence selected by the Academy of Finland and projects funded by the European Research Council."
+            url="https://www.google.com"
+            url-title="Check this link"
+            sc-label="label for link"
+          ></hy-introduction>
           <hy-paragraph-text>
             THIS IS Pagination
           </hy-paragraph-text>