diff --git a/main/styleguide/source/_patterns/organisms/articles-section.mustache b/main/styleguide/source/_patterns/organisms/articles-section.mustache
index 9092b4a218be6c5b158e3b23718d8bf263414b38..2964214dbd80d0d5b5c6fdaa2fc3485ebf05ceb1 100644
--- a/main/styleguide/source/_patterns/organisms/articles-section.mustache
+++ b/main/styleguide/source/_patterns/organisms/articles-section.mustache
@@ -6,7 +6,59 @@
     </h2>
     {{> molecules-main-article-preview }}
     <div class="__js-root">
-      <ui-article-carousel></ui-article-carousel>
+      <ui-article-carousel>
+        <div>
+          <div class="flex max-w-md items-start">
+            <img src="https://i.picsum.photos/id/523/132/132.jpg?hmac=XjW7KxLZNbta7gMDNvldHNGwA9XyxpjBFUGkJqrMR4o" alt=""
+                 class="w-16 xl:w-36 mr-4">
+            <div class="flex flex-col justify-between items-start">
+              <span class="text-green-500 mb-2">23.2.2022</span>
+              <h4 class="uppercase mb-2">
+                Komentář Lukáše Koláříka: Kriminalita ve virtuálním prostoru není imaginární,
+                ale skutečná. Jak nenaletět internetovým šmejdům?
+              </h4>
+              <a href="" class="btn btn__slide__wrap ">
+                <span class="btn text-sm bg-black text-white w-32 lg:text-base">Zjistit více3</span>
+                <span class="btn text-sm bg-white  w-32 lg:text-base">Zjistit více3</span>
+              </a>
+            </div>
+          </div>
+        </div>
+        <div>
+          <div class="flex max-w-md items-start">
+            <img src="https://i.picsum.photos/id/523/132/132.jpg?hmac=XjW7KxLZNbta7gMDNvldHNGwA9XyxpjBFUGkJqrMR4o" alt=""
+                 class="w-16 xl:w-36 mr-4">
+            <div class="flex flex-col justify-between items-start">
+              <span class="text-green-500 mb-2">23.2.2022</span>
+              <h4 class="uppercase mb-2">
+                Komentář Lukáše Koláříka: Kriminalita ve virtuálním prostoru není imaginární,
+                ale skutečná. Jak nenaletět internetovým šmejdům?
+              </h4>
+              <a href="" class="btn btn__slide__wrap ">
+                <span class="btn text-sm bg-black text-white w-32 lg:text-base">Zjistit více3</span>
+                <span class="btn text-sm bg-white w-32 lg:text-base">Zjistit více3</span>
+              </a>
+            </div>
+          </div>
+        </div>
+        <div>
+          <div class="flex max-w-md items-start">
+            <img src="https://i.picsum.photos/id/523/132/132.jpg?hmac=XjW7KxLZNbta7gMDNvldHNGwA9XyxpjBFUGkJqrMR4o" alt=""
+                 class="w-16 xl:w-36 mr-4">
+            <div class="flex flex-col justify-between items-start">
+              <span class="text-green-500 mb-2">23.2.2022</span>
+              <h4 class="uppercase mb-2">
+                Komentář Lukáše Koláříka: Kriminalita ve virtuálním prostoru není imaginární,
+                ale skutečná. Jak nenaletět internetovým šmejdům?
+              </h4>
+              <a href="" class="btn btn__slide__wrap ">
+                <span class="btn text-sm bg-black text-white w-32 lg:text-base">Zjistit více3</span>
+                <span class="btn text-sm bg-white w-32 lg:text-base">Zjistit více3</span>
+              </a>
+            </div>
+          </div>
+        </div>
+      </ui-article-carousel>
     </div>
   </div>
 </div>
diff --git a/main/styleguide/source/_patterns/templates/homepage.mustache b/main/styleguide/source/_patterns/templates/homepage.mustache
index 398d05afa4559ef71ebf1d713a4a6b92ef0362bc..dc0b7349c2f82af05de79e4043bc2358beee71d1 100644
--- a/main/styleguide/source/_patterns/templates/homepage.mustache
+++ b/main/styleguide/source/_patterns/templates/homepage.mustache
@@ -2,7 +2,47 @@
 
 <main role="main">
   <div class="__js-root">
-    <ui-header-carousel></ui-header-carousel>
+    <ui-header-carousel>
+      <div class="xl:h-screen relative">
+        <img src="https://unsplash.it/792/387?image=4" draggable="false">
+        <div class="header-carousel--text grid-container">
+          <div class="grid-content-with-right-side">
+            <h1 class="text-white">72% domácností bylo</h1>
+            <h1 class="text-orange-250">násilně digitalizováno</h1>
+            <a href="" class="btn btn__slide__wrap ">
+              <span class="btn text-sm bg-white w-32 lg:text-base">Zjistit více1</span>
+              <span class="btn text-sm bg-black text-white w-32 lg:text-base">Zjistit více1</span>
+            </a>
+          </div>
+        </div>
+      </div>
+      <div class="xl:h-screen relative">
+        <img src="https://unsplash.it/792/387?image=4" draggable="false">
+        <div class="header-carousel--text grid-container">
+          <div class="grid-content-with-right-side">
+            <h1 class="text-white">72% domácností bylo</h1>
+            <h1 class="text-orange-250">násilně digitalizováno</h1>
+            <a href="" class="btn btn__slide__wrap ">
+              <span class="btn text-sm bg-white w-32 lg:text-base">Zjistit více2</span>
+              <span class="btn text-sm bg-black text-white w-32 lg:text-base">Zjistit více2</span>
+            </a>
+          </div>
+        </div>
+      </div>
+      <div class="xl:h-screen relative">
+        <img src="https://unsplash.it/792/387?image=4" draggable="false">
+        <div class="header-carousel--text grid-container">
+          <div class="grid-content-with-right-side">
+            <h1 class="text-white">72% domácností33 bylo</h1>
+            <h1 class="text-orange-250">násilně digitalizováno</h1>
+            <a href="" class="btn btn__slide__wrap ">
+              <span class="btn text-sm bg-white w-32 lg:text-base">Zjistit více3</span>
+              <span class="btn text-sm bg-black text-white w-32 lg:text-base">Zjistit více3</span>
+            </a>
+          </div>
+        </div>
+      </div>
+    </ui-header-carousel>
   </div>
   {{> organisms-twitter-section }}
   {{> organisms-articles-section }}
diff --git a/main/styleguide/source/js/components/articles/ArticleCarousel.vue b/main/styleguide/source/js/components/articles/ArticleCarousel.vue
index b2b80c0b77cec5a4c23783dac49d62753c55a917..5c4ba2ba61675f751723c9b473e693206d60be46 100644
--- a/main/styleguide/source/js/components/articles/ArticleCarousel.vue
+++ b/main/styleguide/source/js/components/articles/ArticleCarousel.vue
@@ -1,56 +1,6 @@
 <template>
   <vue-slick-carousel v-bind="settings" class="article-carousel">
-    <div>
-      <div class="flex max-w-md items-start">
-        <img src="https://i.picsum.photos/id/523/132/132.jpg?hmac=XjW7KxLZNbta7gMDNvldHNGwA9XyxpjBFUGkJqrMR4o" alt=""
-             class="w-16 xl:w-36 mr-4">
-        <div class="flex flex-col justify-between items-start">
-          <span class="text-green-500 mb-2">23.2.2022</span>
-          <h4 class="uppercase mb-2">
-            Komentář Lukáše Koláříka: Kriminalita ve virtuálním prostoru není imaginární,
-            ale skutečná. Jak nenaletět internetovým šmejdům?
-          </h4>
-          <a href="" class="btn btn__slide__wrap ">
-            <span class="btn text-sm bg-black text-white w-32 lg:text-base">Zjistit více3</span>
-            <span class="btn text-sm bg-white  w-32 lg:text-base">Zjistit více3</span>
-          </a>
-        </div>
-      </div>
-    </div>
-    <div>
-      <div class="flex max-w-md items-start">
-        <img src="https://i.picsum.photos/id/523/132/132.jpg?hmac=XjW7KxLZNbta7gMDNvldHNGwA9XyxpjBFUGkJqrMR4o" alt=""
-             class="w-16 xl:w-36 mr-4">
-        <div class="flex flex-col justify-between items-start">
-          <span class="text-green-500 mb-2">23.2.2022</span>
-          <h4 class="uppercase mb-2">
-            Komentář Lukáše Koláříka: Kriminalita ve virtuálním prostoru není imaginární,
-            ale skutečná. Jak nenaletět internetovým šmejdům?
-          </h4>
-          <a href="" class="btn btn__slide__wrap ">
-            <span class="btn text-sm bg-black text-white w-32 lg:text-base">Zjistit více3</span>
-            <span class="btn text-sm bg-white w-32 lg:text-base">Zjistit více3</span>
-          </a>
-        </div>
-      </div>
-    </div>
-    <div>
-      <div class="flex max-w-md items-start">
-        <img src="https://i.picsum.photos/id/523/132/132.jpg?hmac=XjW7KxLZNbta7gMDNvldHNGwA9XyxpjBFUGkJqrMR4o" alt=""
-             class="w-16 xl:w-36 mr-4">
-        <div class="flex flex-col justify-between items-start">
-          <span class="text-green-500 mb-2">23.2.2022</span>
-          <h4 class="uppercase mb-2">
-            Komentář Lukáše Koláříka: Kriminalita ve virtuálním prostoru není imaginární,
-            ale skutečná. Jak nenaletět internetovým šmejdům?
-          </h4>
-          <a href="" class="btn btn__slide__wrap ">
-            <span class="btn text-sm bg-black text-white w-32 lg:text-base">Zjistit více3</span>
-            <span class="btn text-sm bg-white w-32 lg:text-base">Zjistit více3</span>
-          </a>
-        </div>
-      </div>
-    </div>
+    <slot></slot>
   </vue-slick-carousel>
 </template>
 
diff --git a/main/styleguide/source/js/components/header/HeaderCarousel.vue b/main/styleguide/source/js/components/header/HeaderCarousel.vue
index 0a2f742ce0aa8873cdda6a27c062f4fda53a90d4..c431c54e4721a4874d72e733a898a1cd62b928c0 100644
--- a/main/styleguide/source/js/components/header/HeaderCarousel.vue
+++ b/main/styleguide/source/js/components/header/HeaderCarousel.vue
@@ -1,64 +1,8 @@
 <template>
   <div class="header-carousel mb-8 xl:mb-32">
     <vue-slick-carousel v-bind="settings">
-      <div class="xl:h-screen relative">
-        <img src="https://unsplash.it/792/387?image=4" draggable="false">
-        <div class="header-carousel--text grid-container">
-          <div class="grid-content-with-right-side">
-            <h1 class="text-white">72% domácností bylo</h1>
-            <h1 class="text-orange-250">násilně digitalizováno</h1>
-            <a href="" class="btn btn__slide__wrap ">
-              <span class="btn text-sm bg-white w-32 lg:text-base">Zjistit více1</span>
-              <span class="btn text-sm bg-black text-white w-32 lg:text-base">Zjistit více1</span>
-            </a>
-          </div>
-        </div>
-      </div>
-      <div class="xl:h-screen relative">
-        <img src="https://unsplash.it/792/387?image=4" draggable="false">
-        <div class="header-carousel--text grid-container">
-          <div class="grid-content-with-right-side">
-            <h1 class="text-white">72% domácností bylo</h1>
-            <h1 class="text-orange-250">násilně digitalizováno</h1>
-            <a href="" class="btn btn__slide__wrap ">
-              <span class="btn text-sm bg-white w-32 lg:text-base">Zjistit více2</span>
-              <span class="btn text-sm bg-black text-white w-32 lg:text-base">Zjistit více2</span>
-            </a>
-          </div>
-        </div>
-      </div>
-      <div class="xl:h-screen relative">
-        <img src="https://unsplash.it/792/387?image=4" draggable="false">
-        <div class="header-carousel--text grid-container">
-          <div class="grid-content-with-right-side">
-            <h1 class="text-white">72% domácností33 bylo</h1>
-            <h1 class="text-orange-250">násilně digitalizováno</h1>
-            <a href="" class="btn btn__slide__wrap ">
-              <span class="btn text-sm bg-white w-32 lg:text-base">Zjistit více3</span>
-              <span class="btn text-sm bg-black text-white w-32 lg:text-base">Zjistit více3</span>
-            </a>
-          </div>
-        </div>
-      </div>
-<!--      <div class="xl:h-screen relative">-->
-<!--        <img src="https://unsplash.it/792/387?image=1" draggable="false">-->
-<!--        <div class="header-carousel&#45;&#45;text">-->
-<!--          <h1 class="text-white">72% domácností bylo</h1>-->
-<!--          <h1 class="text-orange-250">násilně digitalizováno</h1>-->
-<!--        </div>-->
-<!--      </div>-->
-      <!--      <div class="homepage-item" style="background: url('https://placeimg.com/1920/1080/any?1') no-repeat center / cover">-->
-      <!--        <div class="container">-->
-      <!--          <h1 class="head-8xl">72% domácností bylo</h1>-->
-      <!--          <h1 class="head-8xl">násilně digitalizováno</h1>-->
-      <!--        </div>-->
-      <!--      </div>-->
-      <!--      <div class="homepage-item" style="background: url('https://placeimg.com/1920/1080/any?1') no-repeat center / cover">-->
-      <!--        <div class="container">-->
-      <!--          <h1 class="head-8xl">72% domácností bylo</h1>-->
-      <!--          <h1 class="head-8xl">násilně digitalizováno</h1>-->
-      <!--        </div>-->
-      <!--      </div>-->
+      <slot>
+      </slot>
     </vue-slick-carousel>
   </div>
 </template>
@@ -69,9 +13,6 @@ import VueSlickCarousel from 'vue-slick-carousel'
 export default {
   components: {VueSlickCarousel},
   name: 'HeaderCarousel',
-  created() {
-    console.log('test')
-  },
   data: () => ({
     settings: {
       "fade": true,