diff --git a/src/components/common/ButtonCommon/ButtonCommon.module.scss b/src/components/common/ButtonCommon/ButtonCommon.module.scss
index a0c33947d..32cf65655 100644
--- a/src/components/common/ButtonCommon/ButtonCommon.module.scss
+++ b/src/components/common/ButtonCommon/ButtonCommon.module.scss
@@ -103,6 +103,20 @@
       }
     }
   }
+  &.small {
+    .inner {
+      padding: .5rem 1rem;
+      &.onlyIcon {
+        padding: 1rem;
+      }
+      @screen md {
+        padding: .8rem 1.6rem;
+        &.onlyIcon {
+          padding: .8rem;
+        }
+      }
+    }
+  }
 
   &.large {
     .inner {
diff --git a/src/components/common/ButtonCommon/ButtonCommon.tsx b/src/components/common/ButtonCommon/ButtonCommon.tsx
index 965e9519e..d83621d30 100644
--- a/src/components/common/ButtonCommon/ButtonCommon.tsx
+++ b/src/components/common/ButtonCommon/ButtonCommon.tsx
@@ -5,7 +5,7 @@ import s from './ButtonCommon.module.scss'
 interface Props {
     children?: React.ReactNode,
     type?: 'primary' | 'light' | 'ghost' | 'lightBorderNone',
-    size?: 'default' | 'large',
+    size?: 'default' | 'large' | 'small',
     icon?: React.ReactNode,
     isIconSuffix?: boolean,
     loading?: boolean,
diff --git a/src/components/common/ButtonIconBuy/ButtonIconBuy.tsx b/src/components/common/ButtonIconBuy/ButtonIconBuy.tsx
index c1209c1f8..c93b8ca6f 100644
--- a/src/components/common/ButtonIconBuy/ButtonIconBuy.tsx
+++ b/src/components/common/ButtonIconBuy/ButtonIconBuy.tsx
@@ -4,13 +4,13 @@ import ButtonCommon from '../ButtonCommon/ButtonCommon'
 
 interface Props {
     type?: 'primary' | 'light' | 'ghost',
-    size?: 'default' | 'large',
+    size?: 'default' | 'large' | 'small',
     loading?: boolean,
     disabled?: boolean,
     onClick?: () => void,
 }
 
-const ButtonIconBuy = memo(({ type = 'light', size = 'default', loading = false, disabled, onClick }: Props) => {
+const ButtonIconBuy = memo(({ type = 'light', size = 'small', loading = false, disabled, onClick }: Props) => {
     return (
         <ButtonCommon
             type={type}
diff --git a/src/components/common/ProductCard/ProductCard.tsx b/src/components/common/ProductCard/ProductCard.tsx
index af982cbd1..a46e8a6fb 100644
--- a/src/components/common/ProductCard/ProductCard.tsx
+++ b/src/components/common/ProductCard/ProductCard.tsx
@@ -63,15 +63,15 @@ const ProductCard = ({
         {
           isSingleButton ?
             <div className={s.cardButton}>
-              <ButtonCommon type="light" icon={<IconBuy />}>Add to cart</ButtonCommon>
+              <ButtonCommon type="light" icon={<IconBuy />} size='small'>Add to cart</ButtonCommon>
             </div>
             :
             <>
               <div className={s.cardIcon}>
-                <ButtonIconBuy />
+                <ButtonIconBuy/>
               </div>
               <div className={s.cardButton}>
-                <ButtonCommon type="light">{buttonText}</ButtonCommon>
+                <ButtonCommon type="light" size='small'>{buttonText}</ButtonCommon>
               </div>
             </>
         }