diff --git a/pages/test.tsx b/pages/test.tsx
index 6bcd178f9..f6d4011eb 100644
--- a/pages/test.tsx
+++ b/pages/test.tsx
@@ -1,6 +1,96 @@
 import { useState } from 'react'
 import { ButtonCommon, Layout, ModalCommon } from 'src/components/common'
-
+import { CollectionCarcousel } from 'src/components/modules/home'
+import image5 from '../public/assets/images/image5.png'
+import image6 from '../public/assets/images/image6.png'
+import image7 from '../public/assets/images/image7.png'
+import image8 from '../public/assets/images/image8.png'
+const dataTest = [
+  {
+    name: 'Tomato',
+    weight: '250g',
+    category: 'VEGGIE',
+    price: 'Rp 27.500',
+    imageSrc: image5.src,
+  },
+  {
+    name: 'Cucumber',
+    weight: '250g',
+    category: 'VEGGIE',
+    price: 'Rp 27.500',
+    imageSrc: image6.src,
+  },
+  {
+    name: 'Carrot',
+    weight: '250g',
+    category: 'VEGGIE',
+    price: 'Rp 27.500',
+    imageSrc: image7.src,
+  },
+  {
+    name: 'Salad',
+    weight: '250g',
+    category: 'VEGGIE',
+    price: 'Rp 27.500',
+    imageSrc: image8.src,
+  },
+  {
+    name: 'Tomato',
+    weight: '250g',
+    category: 'VEGGIE',
+    price: 'Rp 27.500',
+    imageSrc: image5.src,
+  },
+  {
+    name: 'Cucumber',
+    weight: '250g',
+    category: 'VEGGIE',
+    price: 'Rp 27.500',
+    imageSrc: image6.src,
+  },
+  {
+    name: 'Tomato',
+    weight: '250g',
+    category: 'VEGGIE',
+    price: 'Rp 27.500',
+    imageSrc: image5.src,
+  },
+  {
+    name: 'Cucumber',
+    weight: '250g',
+    category: 'VEGGIE',
+    price: 'Rp 27.500',
+    imageSrc: image6.src,
+  },
+  {
+    name: 'Carrot',
+    weight: '250g',
+    category: 'VEGGIE',
+    price: 'Rp 27.500',
+    imageSrc: image7.src,
+  },
+  {
+    name: 'Salad',
+    weight: '250g',
+    category: 'VEGGIE',
+    price: 'Rp 27.500',
+    imageSrc: image8.src,
+  },
+  {
+    name: 'Tomato',
+    weight: '250g',
+    category: 'VEGGIE',
+    price: 'Rp 27.500',
+    imageSrc: image5.src,
+  },
+  {
+    name: 'Cucumber',
+    weight: '250g',
+    category: 'VEGGIE',
+    price: 'Rp 27.500',
+    imageSrc: image6.src,
+  },
+]
 export default function Test() {
   const [visible, setVisible] = useState(false)
   const onClose = () => {
@@ -17,6 +107,13 @@ export default function Test() {
 					Lorem ipsum dolor sit amet consectetur adipisicing elit. Consectetur officiis dolorum ea incidunt. Sint, cum ullam. Labore vero quod itaque, officia magni molestias! Architecto deserunt soluta laborum commodi nesciunt delectus similique temporibus distinctio? Facere eaque minima enim modi magni, laudantium, animi mollitia beatae repudiandae maxime labore error nesciunt, nisi est?
 				</div>
 			</ModalCommon>
+      <CollectionCarcousel
+        data={dataTest}
+        itemKey="product-2"
+        title="VEGGIE"
+        subtitle="Last call! Shop deep deals on 100+ bulk picks while you can."
+        category={"veggie"}
+      />
     </>
   )
 }
diff --git a/src/components/modules/home/CollectionCarcoucel/CollectionCarcoucel.module.scss b/src/components/modules/home/CollectionCarcousel/CollectionCarcousel.module.scss
similarity index 100%
rename from src/components/modules/home/CollectionCarcoucel/CollectionCarcoucel.module.scss
rename to src/components/modules/home/CollectionCarcousel/CollectionCarcousel.module.scss
diff --git a/src/components/modules/home/CollectionCarcoucel/CollectionCarcoucel.tsx b/src/components/modules/home/CollectionCarcousel/CollectionCarcousel.tsx
similarity index 96%
rename from src/components/modules/home/CollectionCarcoucel/CollectionCarcoucel.tsx
rename to src/components/modules/home/CollectionCarcousel/CollectionCarcousel.tsx
index 769dbd550..594fd251e 100644
--- a/src/components/modules/home/CollectionCarcoucel/CollectionCarcoucel.tsx
+++ b/src/components/modules/home/CollectionCarcousel/CollectionCarcousel.tsx
@@ -7,7 +7,7 @@ import {
 import { CollectionHeadingProps } from 'src/components/common/CollectionHeading/CollectionHeading'
 import { ProductCardProps } from 'src/components/common/ProductCard/ProductCard'
 import { QUERY_KEY, ROUTE } from 'src/utils/constanst.utils'
-import s from './CollectionCarcoucel.module.scss'
+import s from './CollectionCarcousel.module.scss'
 interface ColectionCarcoucelProps extends CollectionHeadingProps {
   data: ProductCardProps[]
   itemKey: string
diff --git a/src/components/modules/home/HomeCollection/HomeCollection.tsx b/src/components/modules/home/HomeCollection/HomeCollection.tsx
index 295a0ca28..bd1cd33d6 100644
--- a/src/components/modules/home/HomeCollection/HomeCollection.tsx
+++ b/src/components/modules/home/HomeCollection/HomeCollection.tsx
@@ -1,5 +1,5 @@
 import React from 'react'
-import { CollectionCarcoucel } from '..'
+import { CollectionCarcousel } from '..'
 import image5 from '../../../../../public/assets/images/image5.png'
 import image6 from '../../../../../public/assets/images/image6.png'
 import image7 from '../../../../../public/assets/images/image7.png'
@@ -95,7 +95,7 @@ const dataTest = [
 const HomeCollection = (props: HomeCollectionProps) => {
   return (
     <div className="w-full">
-      <CollectionCarcoucel
+      <CollectionCarcousel
         type="highlight"
         data={dataTest}
         itemKey="product-1"
@@ -103,35 +103,35 @@ const HomeCollection = (props: HomeCollectionProps) => {
         subtitle="Last call! Shop deep deals on 100+ bulk picks while you can."
         category={"veggie"}
       />
-      <CollectionCarcoucel
+      <CollectionCarcousel
         data={dataTest}
         itemKey="product-2"
         title="VEGGIE"
         subtitle="Last call! Shop deep deals on 100+ bulk picks while you can."
         category={"veggie"}
       />
-      <CollectionCarcoucel
+      <CollectionCarcousel
         data={dataTest}
         itemKey="product-3"
         title="VEGGIE"
         subtitle="Last call! Shop deep deals on 100+ bulk picks while you can."
         category={"veggie"}
       />
-      <CollectionCarcoucel
+      <CollectionCarcousel
         data={dataTest}
         itemKey="product-4"
         title="VEGGIE"
         subtitle="Last call! Shop deep deals on 100+ bulk picks while you can."
         category={"veggie"}
       />
-      <CollectionCarcoucel
+      <CollectionCarcousel
         data={dataTest}
         itemKey="product-5"
         title="VEGGIE"
         subtitle="Last call! Shop deep deals on 100+ bulk picks while you can."
         category={"veggie"}
       />
-      <CollectionCarcoucel
+      <CollectionCarcousel
         data={dataTest}
         itemKey="product-6"
         title="VEGGIE"
diff --git a/src/components/modules/home/index.ts b/src/components/modules/home/index.ts
index a9948d185..cd3129cc7 100644
--- a/src/components/modules/home/index.ts
+++ b/src/components/modules/home/index.ts
@@ -1,5 +1,5 @@
 export { default as HomeBanner } from './HomeBanner/HomeBanner'
-export { default as CollectionCarcoucel } from './CollectionCarcoucel/CollectionCarcoucel'
+export { default as CollectionCarcousel } from './CollectionCarcousel/CollectionCarcousel'
 export { default as HomeCategories } from './HomeCategories/HomeCategories'
 export { default as HomeCTA } from './HomeCTA/HomeCTA'
 export { default as HomeSubscribe } from './HomeSubscribe/HomeSubscribe'