diff --git a/src/components/ProductDescription/index.js b/src/components/ProductDescription/index.js
new file mode 100644
index 0000000..aa11d56
--- /dev/null
+++ b/src/components/ProductDescription/index.js
@@ -0,0 +1,111 @@
+import React from "react";
+
+const ProductDescription = ({
+    navTitles,
+    items,
+    addToCart
+}) =>{
+    return(
+        <>
+            <div className="flex w-full rounded  bg-gray-200 justify-center mt-6 ">
+                <ul className="w-full flex justify-center">
+                    {navTitles.map(item => <li key={`NavTitle_${item.id}`} 
+                    className={`p-6 mx-4 cursor-pointer
+                     ${item.isActive ? 'border-0 border-b-4 border-solid border-blue-500' : null}`
+                     } 
+                     onClick={() => item.isActive ? null : item.isActive = !item.isActive }>
+                         {item.title}</li>)}
+                </ul>
+            </div>
+            <div className="flex w-full ">
+                <div className="flex-1 ">
+                   {items.map(e => (
+                       
+                            e.items.map(item => (
+                                    <ul className="flex w-full flex-1 my-2 items-center">
+                                    <li className="py-4 px-8  min-w-md bg-gray-200 ml-4 text-blueC0" style={{minWidth: '300px'}}>{item.title}</li>
+                                    <li className="py-4 px-8  min-w-md bg-gray-200 ml-4 w-full">{item.description}</li>
+                                    </ul>  
+                                ))
+                            
+                        
+                   ))} 
+                </div>
+                <div className="my-2">
+                    {addToCart}
+                </div>
+
+            </div>
+        </>
+    );
+};
+
+
+
+
+
+export default ProductDescription;
+
+
+
+
+ProductDescription.defaultProps = {
+    navTitles: [
+        {
+            id: 0,
+            title: 'مشخصات',
+            isActive: true,
+            name: 'moshakhasat'
+        },
+        {
+            id: 1,
+            title: 'نقد و بررسی',
+            isActive: false
+        },
+        {
+            id: 2,
+            title: 'برسش و باسخ',
+            isActive:false
+        },
+    ],
+    items: [
+        {
+            name: 'moshakhasat',
+            items: [
+                {
+                    title : 'وزن کتاب',
+                    description: '۱ کیلوگرم'
+                },
+                {
+                    title : 'تعداد صفحات',
+                    description: '400 صفحه'
+                },
+                {
+                    title : 'نوع کاغذ',
+                    description: 'گلاسه'
+                },
+                {
+                    title : 'شماره شابک',
+                    description: '1225548218000005818765'
+                },
+                {
+                    title : 'انتشارات',
+                    description: 'رزمندگان'
+                },
+                {
+                    title : 'نویسنده و یا معلف',
+                    description: 'یک نویسنده گمنام'
+                },
+                {
+                    title : 'قطع',
+                    description: 'خشتی'
+                },
+                {
+                    title : 'سال انتشار',
+                    description: '1399'
+                },
+        ]
+        }
+    ]
+    
+}
\ No newline at end of file